vuex的流程

这是vuex的关系图

vuex的流程

新建一个文件夹store,再新建一个index.js文件,假设我们在index.js中声明一个city全局数据,如下图:

vuex的流程

在main.js中引入:

vuex的流程

在需要的界面上,使用city这个全局数据:

vuex的流程

视图层(Vue Components)要改变State中的city,就需要通过流程Vue Components--->Actions--->Mutations---->State,所以我们做如下操作:

vuex的流程vuex的流程

然后再通过commit改变Mutations,如下:

vuex的流程

至此,city的全局数据就会被改变