Vuex学习

Vuex是Vue的一个插件，实现集中式数据管理的作用

目的就是为了实现共享，多个组件依赖同一个数据。以及来自不同组件的行为对同一个数据进行改变。

要先去安装Vuex，如果使用的Vue2，就是npm i vuex@3,，然后在引入进来。

引入进来后，需要一个store，只有有了store才能使用里面的API，创建一个store是const store=new Vuex.Store({}),里面配置的就是三个重要的东西，state，actions,mutations.注意，（因为他是一个插件，因此在创建store之前要先Vue.use(Vuex).）然后将创建成功的store放在唯一的那个Vue实例里。这样所有的Vue Component的vc实例都可以访问到store了。访问就是this.$store.xxx

xxx也就是$store里面有两个重要的API分别为dispatch和commit。

this.$store.dispatch(参数1)，参数1是指动作名称。然后就是Vue Component到actions这个过程了。

actions是一个对象，actions里要设置有该动作以函数形式，函数参数1看起来像一个小型的store，里面也有APIdispatch和commit等一些API，不全，但官方有专门的名字叫Context，目的是为了后续到mutatins的过程使用commit这个API。

而actions到mutations过程就是在actions里使用Context参数里的API commit进行，Context.commit(参数)，参数又是mutations里的key值

最后就是mutations是一个对象，它的作用就是实实在在的操纵state里的数据了。里面也是键值对，值也是一个函数，也是可以直接写成一个函数形式的，第一个参数就是state了，就可以获取到state里存储的共享数据，然后就可以操作这个数据了。

如果只是简单的操作的话，不需要去后端请求数据的话，有时候可以直接跳过actions这个步骤，直接在this.$store.commit直接执行到mutations

总结大概：首先用dispatch去获取不同的动作，actions里可以有多个动作的函数，然后获取不同的动作后对应的使用commit到mutations里去操作state里的数据（actions里的动作和mutations里操作数据的函数是在dispatch去访问动作就定义好。）