Vuex получения не обновления

У меня есть следующий геттер: 

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

И в компоненте это вычисляемое свойство, производное от этого геттера: 

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

Возвращаемое значение является правильным, пока я не изменю элемент в массиве ноутбуков, а затем геттер не обновится.

1 18
vue.js vuex

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

42