// main.js
import Vue from 'vue'
import Vuex from 'vuex'
import App from './App.vue'
Vue.use(Vuex)
Vue.config.productionTip = false
const moduleA = {
namespaced: true,
state: {
count: 3
},
mutations: {
increment (state) {
state.count++;
}
},
getters: {
doubleCount (state) {
return state.count * 2;
}
},
actions: {
incrementIfOdd ({ state, commit }) {
if(state.count % 2 === 1) {
commit('increment');
}
}
}
};
const moduleB = {
modules: {
subModule: {
state: {
},
mutations: {
login () {}
},
getters: {
login () {}
},
actions: {
login () {}
}
}
},
state: {
count: 8
},
mutations: {
},
getters: {
},
actions: {
}
};
const store = new Vuex.Store({
modules: {
a: moduleA,
b: moduleB
},
state: {
count: 2
},
mutations: {
},
getters: {
},
actions: {
}
});
new Vue({
render: h => h(App),
store
}).$mount('#app')
// window.console.log( store.state.a.count );
// // store.commit('increment');
// store.commit('a/increment');
// window.console.log( store.state.a.count );
// // window.console.log( store.state.b.count );
store.commit('login');
store.dispatch('login');
store.getters.login;
添加namespaced: true
const moduleB = {
namespaced: true,
modules: {
subModule: {
},
... ...
},
.. ...
};
改爲：
// store.commit('login');
// store.dispatch('login');
// store.getters.login;
store.commit('b/login');
store.dispatch('b/login');
store.getters['b/login'];
添加namespaced: true
const moduleB = {
namespaced: true,
modules: {
subModule: {
namespaced: true,
... ...
},
... ...
},
.. ...
};
// store.commit('login');
// store.dispatch('login');
// store.getters.login;
// store.commit('b/login');
// store.dispatch('b/login');
// store.getters['b/login'];
store.commit('b/subModule/login');
store.dispatch('b/subModule/login');
store.getters['b/subModule/login'];