vuex 突变替换整个状态答案

【问题标题】：vuex mutations replacing the whole statevuex 突变替换整个状态
【发布时间】：2020-02-08 21:24:52
【问题描述】：

我正在使用 Vuex，我对它很陌生。我想将数据提交到商店并用有效负载的内容替换替换状态。

我的商店是使用模块构建的，有问题的模块是用户模块，

目前我正在做一些类似于我的突变的事情，

setUser(state, payload) {
    state.user = {...payload.user}
}

这使我的状态在运行提交后看起来像这样

user: {
   user: {
     nickname: 'Bob',
     host: true,
     emoji: 'Smile',
     passcode: 12345678,
     room_id: 123
   }
}

理想情况下，我不想在用户对象中包含用户对象，我要么希望用户的每个属性都成为状态的一部分，例如，

state : {
    nickname: 'Bob',
    host: true,
    emoji: 'Smile',
    passcode: 12345678,
    room_id: 123
}

或者它可能看起来像这样，

state : {
    user: {
        nickname: 'Bob',
        host: true,
        emoji: 'Smile',
        passcode: 12345678,
        room_id: 123
    }
}

我不明白我为什么收到state.user.user？

这是我所在州的用户模块，

export default {
state: {
    user: {}
},
mutations: {
    setUser(state, payload) {
        state.user = {...payload.user}
    }
},
actions: {

},
getters: {

}

};

我也用state:{}尝试了上述方法

【问题讨论】：

你能告诉我console.log(payload)在setUser(state, payload)方法中的输出吗

标签： javascript vue.js vuex store

【解决方案1】：

我同意@isebarn，如果您提供有效载荷附带的内容，这应该很容易解决。

{ "quiz_history": [], "user": { "id": 1, "nickname": "Bob", "login_code": "76752576", "host": 1, "room_id": 1, “表情符号”：“笑脸”，“created_at”：“2019-10-11 11:09:12”，“updated_at”：“2019-10-11 11:09:12”}}

如果这是您获得并传递给方法的内容，那么它应该可以工作。但我猜你可能传递了其他东西，三点传播语法出错了。

【讨论】：

【解决方案2】：

这是因为你在下面的突变层中间接创建了另一个用户对象

   setUser(state, payload) {
        state.user = {...payload.user }
    }

在突变层中，状态已经代表了整个用户状态。所以这里可以直接赋值用户对象。

   setUser(state, payload) {
        state = {...payload.user }
    }

通常状态对象需要如下初始化，

state : {
    nickname: '',
    host: false,
    emoji: '',
    passcode: null,
    room_id: null
}

【讨论】：

我已经将我的代码更改为上述代码并且我的状态只是保持初始状态，如果有任何帮助，他就是我的行动，return new Promise((resolve, reject) => { axios({url: '/api/app', data: {}, method: 'GET'}) .then(response => { commit('setUser', response.data); resolve(response) }) .catch(error => { reject(error); }); })response.data 中有一个用户对象。
你能在这里分享一下response.data吗？
{ "quiz_history": [], "user": { "id": 1, "nickname": "Bob", "login_code": "76752576", "host": 1, "room_id": 1, "emoji": "Smiley", "created_at": "2019-10-11 11:09:12", "updated_at": "2019-10-11 11:09:12" } }