vuex是vue.js的状态管理工具、通过vuex我们可以解决组件之间数据共享的问题,后期也方便我们管理以及维护。
vuex 的五大核心:state 、getters 、mutations 、actions 、module
state: 存放状态/数据的
getters: vuex的计算属性
mutations: 唯一能改变state的状态/数据的工具
actinos: 异步操作 可以通过dispatch来分发从而改变state
基本用法:
通过在根目录下新建一个store文件夹,在文件夹下创建一个index.js文件,最后在引入main.js中引入,并挂载到实例上,之后那个组件要用vuex 就调用就可以了
数据持久化:
vuex里面存放的数据,页面一刷新就会丢失
解决办法:存放在本地“localStorage” 或者“sessionStorage”里面
也可以在vuex中安装vuex-persistedstate插件,进行持久化配置就可以了
辅助函数(语法糖):
vuex有四个辅助函数(4大金刚)
mapState , mapActions , mapMutations , mapGetters
辅助函数可以把vuex中的数据和方法映射到vue组件中。达到简化操作的目的
如何使用:
在vue组件中引入:import {mapState , mapActions , mapMutations , mapGetters} from 'vuex'