Vue.js VueJS、Vuex和复杂状态

由于（我认为）一个复杂的数据模型，我成功地用我的Vuex商店打破了VueJS的反应性。数据是对象数组的对象，如下所示：

"users": { 
  "2017": [
    { id: 1, name: "bob" },
    { id: 2, name: "jane" },
  ],
  "2016": [ 
    ...
  ]
},
"dude": null

  computed: {
    user () {
      return this.$store.state.users.users[this.$store.state.users.currentDate][this.$store.state.users.currentUserIndex]
    },
    ...

我最初在商店中存储ES6类（我有很多帮助函数），但后来删除了它

为了访问正确的用户，我有一个计算属性，如下所示：

"users": { 
  "2017": [
    { id: 1, name: "bob" },
    { id: 2, name: "jane" },
  ],
  "2016": [ 
    ...
  ]
},
"dude": null

  computed: {
    user () {
      return this.$store.state.users.users[this.$store.state.users.currentDate][this.$store.state.users.currentUserIndex]
    },
    ...

问题发生在我提交一个变异以更新名称时（例如，我可以在Chrome Vue调试器中看到状态已更改，但模板未更改（即，

user.name

继续为以前的名称）

以下是突变的代码：

  PATCH_USER (state, payload) {
    let index = state.users[state.currentDate].findIndex((el) => el.id === payload.user.id)
    let user = Object.assign(state.users[state.currentDate][index], payload.user)
    Vue.set(state.users[state.currentDate], index, user)
  },

现在，那部分让我觉得我在做傻事。如果我为

dude

（根级别状态项）添加一个计算属性，然后将其包含在模板中，则用户名将正确更新

应用程序还有很多，但我希望我所展示的东西有问题

非常感谢您的帮助

更新

经过8个小时的努力，答案似乎在发布到SO的2分钟内就出来了。（感谢@blockhead和@bert evans）

我以为我已经检查了所有的代码，但是结果是第一次从后端服务器加载数据时就错了<代码>有效负载是来自web API的响应：

// bad 
SET_USERS (state, payload) {
  state.users[state.currentDate] = payload.users
}

// good
SET_USERS (state, payload) {
  Vue.set(state.users, state.currentDate, payload.users)
}

---

问题确实是错误地将新密钥分配给现有Vuex对象。以下代码使用

Vue.set

解决了该问题：

SET_USERS (state, payload) {
  // object, key, value
  Vue.set(state.users, state.currentDate, payload.users)
}

---

如果您立即在vue开发工具中看到更新，而不必刷新，这意味着它已经是反应式的。您如何更新用户？我们能看看密码吗？