一定义：

1： 是应用开发的一种状态管理模式,

2：本身具有一个“数据库”的作用，作为数据中心集中式存储数据，类似于是一个仓库，仓库里放了很多对象。 state 就是数据源存放地，从 store 读取数据，若是 store 中的数据改变，依赖的组件也会发生更新，通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性，更多地用于解决跨组件通信数据共享。

二属性：

1：state：统一定义公共数据，单一状态树，仅包含一个store 实例。里面存放的数据是响应式的，从 store 读取数据，若是 store 中的数据发生改变，组件也会发生更新。通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性

 state: {
    title: 'hello world'
  },

2：mutations：更改store中的状态的唯一方法（同步执行）

 mutations: {
    SET_TITLE (state, _title) {
      state.title = _title
    }
  },

3：getters：对 state 进行计算操作，在组件内也可以做计算属性， getters 可以在多给组件之间复用，如果一个状态只在一个组件内使用，是可以不用 getters

 getters={
	//这里我加了一个返回值
    count(state){
        console.log(state.count)
        return state.count
    }
}

4：actions：异步操作，提交的是 mutation,而不是直接变更状态，（异步请求数据后提交）

actions: {
    setAsyncTitle (context, title) {
      axios.get(`/api/get-title?title=${title}`).then(resp => {
        context.commit('SET_TITLEX', resp.data)
      })
    }
  },

5：modules：当管理的状态比较多时；将store对象分割成模块(modules)，方便管理

 modules: {
    a: moduleA,
    b: moduleB
  }

三场景：

1：组件之间全局共享的数据

2：通过后端异步请求的数据（贴合实际需求）

四：优势

1：数据的存取集中，不需要层层传递

2：数据的流动清晰

3：数据都是响应式的

五：缺点

1：刷新数据丢失，恢复为初始状态

解决方案：

1：vuex-persistedstate、vuex-along插件

2：借用浏览器存储localStorage、sessionStorage

3：数据丢失的页面重新发送actions、mutations请求

4：监听浏览器刷新前事件，在浏览器刷新之前就把vuex里的数据保存至sessionStorage中，刷新成功后如果异步请求的数据还没返回则直接获取sessionStorage里的数据，否则获取vuex里的数据。（刷新后还取到后台数据，才会从sessionStorage里取。确保数据的安全性）