状态管理工具
state
存储状态,数据
mutations
当需要修改store中的数据时,不能直接对state进行修改,而要调用mutations中定义的方法进行修改。
function setNum(state, payload){ } this.$store.commit({type:'函数名',参数})
需要通过payload.参数名,才能获取传入的参数
注意:只能处理同步操作,如果是异步操作,先通过actions处理,转为同步操作
actions
进行异步操作,但依然需要通过mutations修改state
this.$store.dispatch('action名')
actions中方法的第一个参数为context,用来调用mutations中的方法
modules
由于vuex建议使用单一状态树,但当数据过多时会过于臃肿
modules将整体分为一个个模块(对象),每个模块拥有自己的state、mutations、actions等等
默认将每个模块中的内容放到store中整合
如:
a模块中的state内容被放到了store的state中:this.$store.a.name
a模块中的方法,在调用时,与之前调用形式相同:this.$store.commit('方法名')
当需要在模块的方法中使用根state时,作为第三个参数传入:rootState.xxx
而模块中actions的方法,只能调用当前模块的mutations
getters
数据需要通过一些操作处理后才能得到。
函数的第一个参数都为state,可以在第二个参数中传入getters对象,获取其他getters方法。如果想要传入其他参数,作为返回函数的参数传入