將接口數據存儲在Vuex裏

    最近做的一個項目中,由於頭部導航是接口返回的,而且數據還特別多,所以這裏就運用到了Vuex來存儲接口返回的數據,這樣子接口就只需要調用一次就可以了。

步驟

1、安裝Vuex

npm install vuex --save

2、引用Vuex
(1)、創建一個store文件夾,在index.js裏引入Vuex
在這裏插入圖片描述
(2)、在main.js裏引入store文件夾

import store from './store'

3、將接口返回的數據存入store裏
在這裏插入圖片描述
4、獲取store裏的數據(在導航組件裏調用store數據)
在這裏插入圖片描述
大功告成~ 這樣子就可以將接口返回的數據存入store裏啦

注意昂:用來解決異步流程改變store裏的數據的,要在actions裏寫,因爲matution是直接進行同步操作,如果你在mutations裏進行異步操作,不會起任何效果,只有通過action=>mutations=>states,這個流程進行操作,數據纔會改變喲
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章