什么是Vuex

一、Vuex的概念

vuex是使用vue中必不可少的一部分，基于父子、兄弟组件，我们传值可能会很方便，它相当于一个公共仓库，保存着所有组件都能共用的数据，那么vuex就很好的解决了我们这种问题，。

二、五大核心

state – 存放状态
getters – state的计算属性
mutations – 更改状态的逻辑，同步操作
actions – 异步操作
module – 将store模块化

三、使用

通过是在根目录下新建一个store文件夹，里面创建一个index.js文件，最后在main.js中引入，并挂载到实例上，之后那个组件中需要用到vuex就调用就行

const store = new Vuex.Store({
  state: {
    // 存放状态
  },
  getters: {
    // state的计算属性
  },
  mutations: {
    // 更改state中状态的逻辑，同步操作
  },
  actions: {
    // 提交mutation，异步操作
  },
  // 如果将store分成一个个的模块的话，则需要用到modules。
   //然后在每一个module中写state, getters, mutations, actions等。
  modules: {
    a: moduleA,
    b: moduleB,
    // ...
  }

四、数据持久

vuex里面存放的数据，页面一经刷新会丢失。

解决办法：

存放在localStorage或者sessionStorage里面，进入页面时判断是否丢失，丢失再去localStorage或者sessionStorage里面取；
在vuex中可以通过安装vuex-persist 插件，进行持久化的配置就行

五、语法糖

辅助函数(4大金刚) mapState,mapActions,mapMutations,mapGetters
辅助函数可以把vuex中的数据和方法映射到vue组件中。达到简化操作的目的

如何使用：

Import { mapActions, mapGetters, mapMutations, mapState } from 'vuex'