安装
参考官网:https://vuex.vuejs.org/zh/installation.html
vuex的五大核心
- state:存放公用数据
- action:存放异步操作,不能直接修改state中的数据,通过dispatch触发action,action会有两个参数,参数一:
context
,使用里面的commit方法触发mutation,参数二:params
传递过来要修改的数据值 - mutation:存放同步操作,修改state中的数据,参数一为
state
,参数二为params
要修改的数据值 - getter:类似于vue的计算属性,当一个数据依赖于另一个数据时使用
- module:模块化管理
使用顺序
1、组件内通过this.$store.dispatch(“changeStataData”, 18)调用action
2、action中监听传递过来的事件changeStataData(context, params)
,通过context.commit("changeStataData", params)
调用mutation,mutation中对state数据进行修改
3、mutation中修改数据:changeStataData(state, params) { state.data = params }
ps:一般批量同步操作以及异步操作建议调用顺序为:action ==> mutation,若是数据量比较少的同步操作,则可以直接在组件内使用commit调用mutation修改数据