VueX 是一个专门为 Vue.js 应用设计的状态管理构架,统一管理和维护各个vue组件的可变化状态
Vuex应用场景
1、多个视图依赖于同一状态;
2、来自于不同视图的行为需要改变同一个状态;
Vuex组成
1、State--数据仓库,用来存储变量
2、getter--用来获取数据,从基本数据(state)派生的数据,相当于state的计算属性
3、Mutation--用来修改数据,提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个 mutation 都有一个字符串的 事件类型 (type) 和 一个回调函数 (handler)。回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数,提交载荷作为第二个参数。
4、Action--用来提交mutation,可以异步操作
5、modules:模块化vuex,可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰,方便管理。
安装Vuex包:npm install vuex
创建Vuex实例:new Vuex.store()4
挂载Vuex:main.js中将vuex挂载到vue对象上
vuex有mapGetters、mapState、mapMutations、mapActions几种结构方法