vuex插件是vue全家桶中十分重要的一款插件，它的作用是沟通各个组件通信的桥梁，通过定义state状态，所有组件都可以通过this.$store.getter或者是mapState来获得状态，也可以通过this.$store.commit来改变状态，那么它是如果开始的？又是如何做到所有组件共享状态的？为什么状态变了其他组件也能立即感知并重新渲染？下面就让我们带着问题一步步去揭开这些神秘的面纱吧
首先我们看看插件的源码结构
然后再看看我们是如何使用它的
Vue main.js
Vue项目中store/index.js
也可以这里这样
某个模块内部：
我们看看vuex/dist/vuex.js导出了什么
根据vue.use函数内部，它会找对象中的install方法 然后将vue实例注入
OK 那我们就进入到install 看看它做了什么
可以看到 这里主要是调用了applyMixin 这个函数的主要作用就是借助了vue.mixin 混入了一个beforeCreate钩子函数 这个钩子做了什么？可以看到他调用了vuexInit
如此 我们可以在组件中使用this.$store来调用它暴露出来的属性或者是api啦
那么我们再看看Store这个构造函数做了什么
1.根据传进来的options初始化各种标记和容器
- 绑定state
自此 我们已经可以知道我们为何能在vue组件中使用this.$store了，同时也知道了为啥修改了state 组件会自动更新了，那么我们接下来看看我们是如何获取state以及修改它的
- 方式一 借助this.$store.getter 很简单 以上已经有答案了
- 方式二 借助...mapState()
我们知道ES6的拓展运算符只针对数组或对象 因此我们可以猜测mapState函数就是根据传进去的对象的key来匹配到val最后导出一个对象 而我们也知道mapState是放在vue组件的computed中的
那我们怎样修改state呢？当然是通过commit啦
Mutation的注册
local是啥？
Mutations的使用