Хранилище Vuex.наблюдение за поведением

#javascript #vue.js #vuex

#javascript #vue.js #vuex

Вопрос:

Я новичок в Vuejs, и я немного застрял с функцией просмотра в Vuex store. Вот мой код для хранилища:

 const storeconf: StoreOptions<any> = {
state: {
    string: 'teststring'
},
actions:{
    changeString({commit}):any{
        commit('stringChange');
    }
},
mutations:{
    stringChange(state){
        state.string=Math.random() ' root';
    }
},
modules: {
    mod:{
        namespaced:true,
        state:{
            string:'modulestring'
        },
        actions:{
            changeString({commit}):any{
                commit('stringChange');
            }
        },
        mutations:{
            stringChange(state){
                state.string=Math.random() ' module';
            }
        },
    }
}
  

..и приложение:

 new Vue({
el: '#app',
store: store,
template:'<button @click="doActions">click</button>',
mounted(){
    this.$store.watch(
            state =>[state.string, state.mod.string],
            watched => console.log(watched[0] ' -- ' watched[1]);
        );
},
methods:{
    doActions:function(){

        this.$store.dispatch('mod/changeString')
        this.$store.dispatch('changeString');

    }
}
  

Дело в том, что когда я запускаю действие в корневом хранилище, наблюдатель работает отлично, но когда я запускаю модуль one с пространством имен (mod / changeString ), наблюдатель вообще ничего не делает.

Что для меня странно, так это то, что действие с пространством имен должным образом изменяет значение хранилища, оно просто не запускает наблюдателя..

Что я делаю не так?

Комментарии:

1. Я думаю, вам не нужно следить за состоянием. Просто используйте вычисляемые свойства, помещая доступ к состоянию внутри вычисляемого перехвата

2. Я вижу, что изменения в state.string или state.mod.string запускают программу наблюдения, как и ожидалось: jsfiddle.net/vo68hpum

Ответ №1:

спасибо, это действительно так. Реальный проект, из которого я извлек этот пример, написан на typescript, следуя этому руководству, и, похоже, проблема в том, что свойство module было установлено как необязательное и не инициализировано. Он по-прежнему регистрировал мутацию и изменял состояние, но не запускал никакого наблюдения. Довольно странно.