vuex store状态管理使用方法

项目使用干货
本博客分为三级：

1. store常用方法说明
2. 变量较多分文件书写
3. 指定store对象代码含义

1. store常用方法说明

main.js注册声明依赖

	import store from './store'
	new Vue({
		store
	}).$mount('#app')

index.js类的书写

	import Vue from 'vue'
	import Vuex from 'vuex'
	Vue.use(Vuex)
	export default new Vuex.Store({
		state: {}, // 全局变量
		mutations: {}, // set方法
		actions: {}, // 导出set
		getters: {} // 全局方法
		modules: {}, // 自定义模块
	})

store内部对象代码编写

	state: {
		geometry: null, // 全局变量示例
	},
	mutations: {
		// set方法写法
		SET_GEOMETRY(state, { geometry }) {
            state.geometry = geometry;
        },
	},
	actions: {
		// 导出set
		setGeometry({ commit }, payload) {
            commit('SET_GEOMETRY', payload);
        },
	},
	modules: { // 项目中用到这几个文件，全局变量较多对其分类
		layerTree,
        normative,
        terminal,
        setting,
        operation
	}

2. 变量较多分文件书写

layerTree.js

	// 全局变量声明
	let codeDictGX = {} // 项目中用到的变量，可声明多个
	function getFormattedTree() {} // 数据不满足条件，可以对其操作在返回有用数据
	export dafault {
    	namespaced: true, // 将 layerTree设为全局变量
    	state: {}, // 全局变量
		mutations: {}, // set方法
		actions: {}, // 导出set
		getters: {} // 全局方法
	}

normative.js terminal.js setting.js operation.js 与之类似

3. 指定store对象代码含义