为什么使用vuex？？？？
在vue开发中，每个组件都有自己独立的数据，整个项目中的所有组件可以通过总线传值，但是如果出现几个组件需要共用同一组数据时，数据管理就会非常麻烦。
vuex简介
vuex是vue的状态 (数据) 管理工具。它采用了一种集中管理数据的思想，将整个项目中所有的公共数据放在一个统一的仓库中。然后所有组件都可以从这个仓库中读取数据，也可以通过仓库提供的方法修改数据。
vuex的五个属性和基本用法
state, getters, mutations, actions, modules。
- state：vuex的基本数据，用来存储变量
- getters：从基本数据(state)派生的数据，相当于state的计算属性
- mutations：提交更新数据的方法，必须是同步的(如果需要异步使用action)。每个 mutations 都有一个字符串的 事件类型
(type) 和 一个 回调函数 (handler)。 回调函数就是我们实际进行状态更改的地方，并且它会接受 state
作为第一个参数，提交载荷作为第二个参数。 - actions：和mutation的功能大致相同，不同之处在于 ==》
>>. Action 提交的是 mutation，而不是直接变更状态。
>>. Action 可以包含任意异步操作。 - modules：模块化vuex，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。
使用下面这两种方法存储数据：
dispatch：异步操作，写法： this.$store.dispatch(‘mutations方法名’,值)
commit：同步操作，写法：this.$store.commit(‘mutations方法名’,值)
vuex安装
在网上看到的三种安装方式，我只用过npm安装
- 在 Vue 之后引入 vuex 会进行自动安装：
<script src="/path/to/vue.js"></script>
<script src="/path/to/vuex.js"></script>
- npm安装
npm install vuex --save
- yarn安装
yarn add vuex
main.js导入
import store from "./store.js";
//导入后在根组件注入
new Vue({
router,
render: h => h(App),
// 在根组件中注入仓库对象
store
}).$mount('#app')