基于vue-cli的vue项目之vuex的使用4-------moudles分块

按照官方文档，就是为了避免代码太长了。所以使用了moudle

1.store.js//配置仓库，第五道第二十六为一个模块。第二十七到四十八为一个模块，在第四十九到五十四行抛出
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const moudlesa = {
	namespaced:true,
state: {
		count: 0
	},
	mutations: {
		incrementa(state, n) {
			console.log(n);
			state.count += n.amout;
		}
	},
	actions: {
		incrementa(context, m) {
			setTimeout(() => {
				context.commit({
					type: "incrementa",
					amout: m.amout
				})
			}, 1000)
		}
	}
}
const moudlesb = {
	namespaced:true,
	state: {
		count: 0
	},
	mutations: {
		incrementb(state, n) {
			console.log(n);
			state.count += n.amout;
		}
	},
	actions: {
		incrementb(context, m) {
			setTimeout(() => {
				context.commit({
					type: "incrementb",
					amout: m.amout
				})
			}, 1000)
		}
	}
}
const store = new Vuex.Store({
	modules: {
		a: moudlesa,
		b: moudlesb

	}

})
//export default store;
export default store;

2.main.js//配置store的路径，在第六十九行使用store
import Vue from 'vue'
import App from './App'
import router from './router'
import store from './vuex/store';
Vue.config.productionTip = false;
new Vue({
	el: '#app',
	router,
	store,
	template: '',
	components: {
		App
	},
})

3app.vue//在组件中使用//在第九十到第九十六提交a模块的数据，第九十七到一百零二行提交b模块的数据