突变后Vuex状态不更新

Question

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

组成部分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)
    })
}

突变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
    }
]

现在，在控制台中。我在变异中的日志显示，有效负载中的“Name”与其他状态属性一起附加到状态。但是当我签入Vue开发工具或尝试访问状态时。名称从组件中显示状态。名称属性，状态为未定义。我做错了什么？

Answer 1

找到了！你的变异应该是

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

因为您传递的只是名称，而不是整个负载