Nuxt中如何使用Vuex-Store异步获取数据

Nuxt是一个基于Vue.js的通用型框架，它集成了使用Vue开发的绝大数组件/框架。

长话短说如何在Vuex-store中获取异步数据呢？

在Nuxt中因为集合了Vuex还有其余的一些配置，大大的方便了咱们使用Vuex；在Nuxt官方文档中写到：

在这里笔者为了方便使用了模块的方式去使用store；

1.1 首先如今store目录下新建.js文件，因为业务需求新建了几个模块的.js文件。

接下来咱们一块儿看一下js文件中是如何新建模块方法的:

1.2 在state方法中初始化基本数据；

1.3 在mutation方法中更新数据

在mutations中会接收state做为第一个参数而且能够接收其余传参；（Tips：一条重要的原则就是要记住 mutation 必须是同步函数。）

在组件中调用mutations中的方法改变状态树种的数据

1.4 在store里如何调用异步数据？

因为mutation方法中只能执行同步方法，如何在store中获取远程服务器中的数据呢？

在此Vuex提供了一个解决方法action，action是一个相似于mutation的方法，它能够包含任何任意异步操做，不一样之处在于action不能直接修改状态只能提交mutation；

在actions中定义好方法后须要在组件中使用store.dispatch进行触发；（Tips：注意文件位置）

Ps：在这里只是针对笔者的使用方式进行讨论，其余调用方式参考官方文档；

至此两种简单的改变状态树中的数据方法结束，后续笔者还会继续添加方法，若有错误请多多指教；