Vuex getter没有更新

Question

我有下面的吸气剂:

withEarmarks: state => {
    var count = 0;
    for (let l of state.laptops) {
        if (l.earmarks.length > 0) {
            count++;
        }
    }
  return count;
}

在一个组件中,这个计算属性派生自该getter:

    withEarmarks() { return this.$store.getters.withEarmarks; },

返回的值是正确的,直到我更改laptops数组中的元素,然后getter不会更新.

Answer 1

在你的情况下state.laptops.earmarks是一个数组,你正在通过它的数组索引来操作它state.laptops[index].Vue无法对状态数组上的突变做出反应(通过索引).该文档为此提供了2种解决方法:

// 1. use purpose built vue method:
Vue.set(state.laptops, index, laptop)

// 2. splice the value in at an index:
state.laptops.splice(index, 1, laptop)

虽然记录在案,但我想在那个页面上写着一个巨大的霓虹灯发光标志,上面写着"如果你不知道这个,你会浪费数小时的生产力",这将是一个很好的补充.

你可以在这里阅读更多关于这个"警告"的信息:https://vuejs.org/v2/guide/list.html#Caveats