vuex基本用法（含modules）

目录结构

i## 代码片段
index.js

// 使用vuex
import Vue from 'vue'
import Vuex from 'vuex'
import m1 from "./modules/m1.js"
import m2 from "./modules/m2.js"

Vue.use(Vuex)

export default new Vuex.Store({
	modules: {
		m1,
		m2
	}
})

m1.js

const state = {
	count: 0
}
const mutations = {
	increment(state) {
		state.count++
	}
}
const actions = {
	increment({
		commit
	}) {
		commit('increment')
	}
}

export default {
	state,
	mutations,
	actions
}

m2.js

const state = {
	count: 0
}
const mutations = {
	decrement(state) {
		state.count--
	}
}
const actions = {
	decrement({
		commit
	}) {
		commit('decrement')
	}
}

export default {
	state,
	mutations,
	actions
}

组件中使用

		computed: {
			count1() {
				return this.$store.state.m1.count
			},
			count2(){
				return this.$store.state.m2.count
			}
		},
		methods: {
			decrement(){
				this.$store.dispatch("decrement")
			}
		}

main.js中引用

import store from './store/index.js'
new Vue({
	el: '#app',
	router,
	store,
	components: {
		App
	},
	template: '<App/>'
})