什么是vuex
1.vuex是什么
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式， 采用集中式存储管理应用的所有组件的状态，解决多组件数据通信。
要点：
vue官方搭配，专属使用 (类似于：vue-router)，有专门的调试工具 集中式管理数据状态方案 (操作更简洁)data() { return { 数据, 状态 }} 数据变化是可预测的 (响应式)
使用Vuex的好处：
1、数据的存取一步到位，不需要层层传递
2、数据的流动非常清晰
3、存储在Vuex中的数据都是响应式的
那么我们先来思考一个问题：什么样的数据适合存储到Vuex中？
答案是：需要共享的数据
Vuex的作用就是：频繁、大范围的数据共享
vue官方提供的独立于组件体系之外的，管理公共数据的工具
2.vuex的5个基本概念
1.state：提供唯一的公共数据源，所有共享的数据统一放到store的state进行储存（类似于data(){return {a:1, b:2，xxxxxx}}）
在vuex中state中定义数据，可以在任何组件中进行调用
调用： 方法一：在方法在直接使用：
<p>{{$store.state.userInfo}}</p>
<p>{{$store.state.routers}}</p>方法二：
this.$store.state.全局数据名称方法三：
从vuex中按需导入mapstate函数
import { mapState } from "vuex";
computed:{
...mapState(["name","age","sex"]),
}
<p>{{$store.state.name}}</p>
<p>{{$store.state.age}}</p>2.mutations ：更改 Vuex 的 store 中的状态的唯一方法是提交 mutation (类似于methods) 在vuex中定义：
state：{
name:"张三",
age:12,
count:2
},
getters:{},
mutations:{
addcount(state,num){
state.count=+state.count+num
},
reduce(state){
state.count--;
}
}在组件中使用：
<button @click="btn">按钮1</button>方法一：使用commit触发Mutation操作
methods:{
//加法
btn(){
this.$store.commit("addcount",10) //每次加十
}
//减法
btn1(){
this.$store.commit("reduce")
}
}方法二：使用辅助函数进行操作，具体方法同上。
methods:{
...mapMutations(["addcount","reduce"]),
btn(){
this.addcount(12);
}
}3.actions： 发起异步操作，Action和Mutation相似，Mutation 不能进行异步操作，若要进行异步操作，就得使用Action 在vuex中定义：
//异步操作mutation
actions:{
asyncAdd(context){
//异步
setTimeout(() =>{
context.commit("reduce")
},1000)
}
}在组件中使用： 方法一：直接使用dispatch触发action函数
this.$store.dispatch("reduce")方法二：使用辅助函数
...mapActions(["asyncAdd"]),
btn2(){
this.asyncAdd();
}4.getters： 类似于computed(计算属性，对于Store中的数据进行加工处理形成新的数据-------派生 )
5.modules： 模块拆分
