Состояние не обновляется в слое представления после его обновления в хранилище - Vuex

Question

Я использую мутацию Vuex, чтобы изменить значение массива с именем practices. Я называю эту мутацию в компоненте под названием PracticeTree, который включает в себя геттер для practices.

 handleNodeClick(data, other) {
     this.expanded=data.namespace
     this.SET_PRACTICES(data.practices)
     console.log('practices as set in view layer: ')
     console.log(this.practices)
 },  

Мутация, которая называется, выглядит так:

SET_PRACTICES(state, data){
    Vue.set(state.practices, data)
    console.log('practices as set in the store:' )
    console.log(state.practices)
},

Я использую Vue.set вместо простого изменения состояния, потому что я подумал, что это может помочь, когда я увидел, что состояние не изменилось на слое вида - но не изменилось.

Вот вывод вышеприведенных функций :

practices as set in the store:
store.js?0571:100 (3) [{…}, {…}, {…}, "": (...), __ob__: Observer]
PracticeTree.vue?f108:95 practices as set in view layer: 
PracticeTree.vue?f108:96 []

Как видите, хотя магазин обновляет значение practices, оно не изменяется внутри компонента.

Есть ли у кого-нибудь какие-либо идеи относительно того, что может идти не так?

Answer 1

Вы используете метод неправильно.

введите описание ссылки здесь

SET_PRACTICES(state, data){
    Vue.set(state, 'practices', data)
    console.log('practices as set in the store:' )
    console.log(state.practices)
}