vuex modules

vuex modules總結

#定義 
	let optionsA = {
		namespaced:true, //如果想要直接取得modules屬性不需要靠點語法往下找的話這個要開啟
		state:{
			a:'a'
		},
		actions:{},
		mutations:{},
		getters:{},
		modules:{}	
	}		
	
	export default new Vuex.Store({
		modules:{
			optionsA
		}
	})
	
#使用 
	#普通系列的使用
	this.$store.state.optionsA.a
	//下面的比較雷同
	this.$store.getters.['optionsA/xxx'] 
	this.$store.commit('optionsA/xxx',value)
	this.$store.dispatch('optionsA/xxx',value)
	
	#map系列
	...mapState('optionsA',{a})   //使用命名空間就是前面要加一個modules的key值
	...mapState({optionsA})
	...mapState('optionsA',['a']) //使用命名空間就是前面要加一個modules的key值
	...mapState([optionsA])
	其他map都一樣
	
#模板上使用
 	{{optionsA.a}} //無命名空間
 	{{a}} //有命名空間

總結

  1. 區分store方便管理
  2. 如果要簡單使用要配置namespaced:true