1，vuex的概述

vex，是一个专门为vue设计的集中式状态管理架构，你可以把他理解为在data中的属性可以共享给其他vue组件使用，也可以理解为vuex是包含全局数据和变量的插件。

2，vuex的使用

1,在使用之前，我们需要安装vuex
npm install vuex --save
2,新建store文件夹，在其下建立store.js，在其中引用vue和vuex

   import Vue from 'vue';
   import Vuex from 'vuex';

3,使用vuex， 引用vue.use 进行引用
Vue.use(Vuex);

state

state:可以说是vuex中的全局访问状态对象，也可以理解为全局变量，常用的三种访问方式：
1，通过store来直接赋值
this.$store.state.count
2，通过mapState的对象来赋值
import {mapState} from 'vuex';

  computed:mapState({
            count:state=>state.count  //理解为传入state对象，修改state.count属性
     })

3，通过mapState的数组来赋值
computed:mapState(["count"])

Mutations

Mutations是唯一能够更改state状态的方式，通过commit一个Mutations来更改，而在Mutations中可以传入state的参数，并且还有接收叫做payload（载荷）的东东作为第二个参数，这个东东是用来记录开发者使用该函数的一些信息。
1，提交Mutations

 <button @click="$store.commit('add',10)">+</button>
 <button @click="$store.commit('reduce')">-</button>
 
const mutations={
        add(state,n){
            state.count+=n;
        },
        reduce(state){
            state.count-=1;
        }
    }

2,获取Mutations的方法
import { mapState,mapMutations } from 'vuex';

  methods:mapMutations([
            'add','reduce'
    ]),
<button @click="reduce">-</button>

3,getters
getters从表面是获得的意思，可以把他看作在获取数据之前进行的一种再编辑,相当于对数据的一个过滤和加工。你可以把它看作store.js的计算属性。

    const getters = {
        count:function(state){
            return state.count +=100;
        }
    }

然后可以在vue组件中可以使用getters

   computed:{
        ...mapState(["count"]),
        count(){
            return this.$store.getters.count;
        }
    },

actions

actions和之前讲的Mutations功能基本一样，不同点是，actions是异步的改变state状态，而Mutations是同步改变状态。至于什么是异步什么是同步这里我就不做太多解释了，如果你不懂自己去百度查一下吧。
actions的使用

    const actions ={
        addAction(context){
            context.commit('add',10)
        },
        reduceAction({commit}){
            commit('reduce')
        }
    }

在vue的组件中使用

    methods:{
        ...mapMutations([  
            'add','reduce'
        ]),
        ...mapActions(['addAction','reduceAction'])
    },

传参的actions：需要手动传参
this.$store.dispatch('fun',this.checkedNames);