在vuex内部我们可以创建全局数据。通过this.$stroe.xxx来拿到对应的数据或者操作对应的方法。并且数据是响应的。那么我们来看下怎么实现这两个功能。
首先数据响应我们可以直接用到vue的内部数据响应。我们可以通过创建一个实例。
看bindData这个方法,我们直接创建一个vue的实例让后将我们的state绑定到对应的data上,然后把我们对应的方法全部绑定到vue.prototype.$store上,这样我们就把对应方法注册到全局了。
现在我们可以直接在任何组件通过this.$store.xx拿到数据和方法了。接下来我们开始写各个方法了.
先看commit
commit接受一个字符串及其其他自定义参数,我们获取到对应的参数,mutation表示对应的mutation函数名称,elargs表示其他参数,那么我们直调用即可。传入对应的state和其他参数即可。这里的state必须是实例内部的data。不然不会响应。
再看dispatch
跟commit一样先获取对应的参数,参数基本一样,只是接受的action函数名称,然后调用action,action的内部接受一个context对象,及其他参数,这个context对象集成我们声明的所以函数,我们全部传入即可。
最后我们的getters
getters我为了统一跟前面一样的风格,一样传入对应的getters函数名称,然后直接执行返回即可。
好了,一个简单的vuex就此实现了,我们带入试一下.
然后你就可以尽情的操作数据了,跟vuex一样。