状态管理库vuex

Vuex是一个专为Vue.js应用程序开发的状态管理库，状态就是指组件之间共享的数据

vue项目中配置状态管理库vuex的流程

1、下载并引入vuex相关内容

 

 2、创建状态管理库对象store

 

 

 3、对外抛出store对象

 

 

 4、在main.js中将对象与当前项目相关联

 

 

 

store状态管理库对象重要组成部分

state：组件之间共享的数据集合

组件中获取方法

1、直接获取
this.$store.state.xxx;
2、使用对象展开运算符的形式获取
...mapState(['xxx','xxx'])

getters:相当于store对象计算属性（主要用于对state的数据进行过滤）

组件中获取方法

1、直接获取
this.$store.getters.xxx；

2、使用对象展开运算符的形式获取
...mapGetters(['xxx','xxx'])

mutations:定义了修改store对象中state数据的同步方法
（要修改的数据不是ajax异步获取的）

组件中如何触发

1、直接使用commit触发
this.$store.commit('xxxx','传递的参数'）

2、使用对象展开运算符mapMutations的形式获取
...mapMutations(['xxx'],'xxx')

 

actions:定义了修改state数据的异步方法|
（修改数据是ajax获取的异步数据）

组件中如何触发

1、直接使用dispatch触发
this.$store.dispatch('xxxx','传递的参数'）

2、使用对象展开运算符mapActions的形式获取
...mapActions(['xxx'],'xxx')