Vuex状态对象长度对计算属性不起作用

Question

我正在尝试从计算属性中获取状态对象的长度，但它似乎没有反应性。

状态结构：

state: {
   user: {
      cards: {},
   }
}

我商店中的吸气剂：

cardCount(state) {
   return Object.keys(state.user.cards).length
}

和计算的道具：

calcLeft() {
  return this.$store.getters.cardsLeft - this.$store.getters.cardCount
}

在state.user.cards更改时，我希望从cardCount返回一个不同的值到计算的prop，但这没有发生，只是保持不变。

Answer 1

感谢skirtle，我跟随the usual caveats（vuex），

更改状态道具可以通过以下语法完成：但它不会是被动的：

state.obj[key] = somevalue

为此，我们可以使用 Vue方式或扩展语法来实现反应性：

Vue方式：

Vue.set(state.obj, key, value)

或类似的spread syntax：

state.obj = {...state.obj, key: value}