Question

我正在尝试使用Vue / Vuex应用程序中的突变将一些值设置为状态。

component.vue

created() {
    let clubId = {'clubId': 31};
    this.$store.dispatch(
    "clubConfiguration/getClub",
    clubId 
  );
}

action.js

getClub(context, payload) {
    ApiService().post('/club/getSingleClub', {
        "ClubId": payload.clubId
    })
     .then(res => {
          context.commit('GET_CLUB_INFORMATION', res.data.data[0]);
     })
     .catch(err => {
           console.log(err)
    })
}

mutation.js

GET_CLUB_INFORMATION(state, payload) {
    state.Name = payload.Name
    console.log(state);
}

state.js

Name: '',
mapLocation: { lat: 39.585693, lng: 2.622868, zoom: 18 },
courts: [
    {
        id: 0,
        number: 1,
        name: 'Court 1',
        map: null
    }
]

现在，在console.log中，我在突变中显示有效负载中的“名称”已与其他状态属性一起附加到该状态。但是，当我检查Vue开发人员工具或尝试从组件访问state.Name时，它将state.Name属性显示为undefined状态。我做错了什么？

Answer 1

找到了！您的突变应该是

CREATE TABLE `team` (
  `id` int(11) NOT NULL
);
/* SQL Error (1822): Failed to add the foreign key constraint. Missing index for constraint 'FK_6C66F57B296CD8AE' in the referenced table 'team' */

因为您只传递了名称，而不是整个有效载荷

突变后Vuex状态未更新

1 个答案: