vuex（vue状态管理）

vuex（vue状态管理）

1.先安装vuex

npm install vuex --save

 

2.在项目的src目录下创建store目录,并且新建index.js文件,然后创建vuex实例,引入vue和vuex,创建Vuex.Store实例保存到store

,最后export 导出store

 

 

3.在main.js文件引入store文件

 

4.Stare:

vuex的数据源,需要保存的数据就存在此处.通过this.$store.state即可获取

 

5.Getters:

相当于vue的computed计算属性,getter的返回值会被缓存起来,只有值发生改变时才会被重新计算

如:监听stare值的变化,返回计算结果

 

 

 

6.Mutations: && Actions

在actions中.为了不直接修改stare的值,所以提交一个actions,在actions仲提交mutation再去修改值

 

7.简便方法

 

mapState,mapGetters,mapActions,可以减少写this.$store的次数