仓库vuex：

定义：

为了方便实现组件之间的数据共享,Vuex是他们团队借鉴了redux,用来实现vue组件全局状态(数据)管理的一种机制.
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。简单来说就是：应用遇到多个组件共享状态时，使用vuex。

特点：

能够在vuex中集中管理共享的数据，易于开发和后期维护
能够高效地实现组件之间的数据共享, 提高开发效率
存储在 vuex中的数据都是响应式的，能够实时保持数据与页面的同步
一般情况下，只有组件之间共享的数据，才有必要存储到vuex中;
对于组件中的私有数据，依旧存储在组件自身的data中即可.

使用场景：一般我们不使用Vuex，当多个组件共享数据或者是跨组件传递数据时，就建议选择使用仓库。

仓库引入方式：（建议使用第二种方法）

1.自己下载引入：

第一步：安装：

     npm i vuex --save

第二步：创建仓库：

创建一个store文件，在文件里面创建一个index.js文件

下面就是index.js的代码

import Vue from 'vue'
import Vuex from 'vuex'
// 让组件的原型链中，有仓库的工具代码
Vue.use(Vuex)

export default new Vuex.Store({
  state: {
  },
  getters: {
  },
  mutations: {
  },
  actions: {
  },
  modules: {
  }
})

第三步：把仓库挂载到vm对象：

在main.js文件：

//引入仓库：
import store from './store'

new Vue({

     render(h){return h(app)},

     router,

     store//挂载以后  所有的组件就可以直接从store中获取全局数据

}).$mount( "#app")

2.cli脚手架引入

vue create 项目名
选择配置 vuex

生成的仓库文件（store文件）：

State：共享状态，vuex的基本数据，用来存储变量，相当于组件data里的数据，只不过此时变成了全局变量。
Getter：基于state的派生状态，相当于组件中的computed中的属性。
Mutation：更改vuex中store共享状态的方法，通过提交mutation来去修改状态，进行同步操作数据，通常用于action获取异步数据，获取通过commit提交数据给mutation，在mutation同步操作state中的数据。
action：支持异步操作，可用于异步获取请求中的数据,并将获取的数据同步commit提交给mutation，实现ajax异步请求数据，mutation将其数据同步到state中。
modules：模块化vuex，为了方便后期对于项目的管理，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。

面试题：

优势和劣势有哪些？

优势主要就是可以全局共享数据，方法。方便统一管理劣势的话，页面刷新后state的变量都会还原清空，不会像cookies一样持久性存储

页面刷新后vuex的state数据丢失怎么解决？

是什么导致了丢失，因为store里的数据是保存在运行内存中的，当页面刷新时页面会重新加载vue实例，store里面的数据就会被重新赋值。

如何避免？其实主要还是看使用的场景是怎样的，如果想某些数据持久性保留也可以搭配使用cookies或者localStorage。比如一些登录的信息等。比如请求拿到了登录信息后可以先存在localStorage，将state里的变量值和sessionStorage里面的绑定，mutations中修改的时候同时修改state和localStorage。最后页面直接使用vuex中的变量。

Vue——仓库vuex：了解仓库、引入仓库、面试题