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：在這里只是針對筆者的使用方式進行討論，其他調用方式參考官方文檔；

至此兩種簡單的改變狀態樹中的數據方法結束，后續筆者還會繼續添加方法，如有錯誤請多多指教；

總結

以上是生活随笔為你收集整理的Nuxt中如何使用Vuex-Store异步获取数据的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。