vuex 狀态管理在 nuxt 中的是用法,記錄下
在 store 目錄下 建立
在 actions.js中
在index.js中
在mutation-types.js 中
在mutations.js 中
在userInfo/index.js中
在userInfo/user.js中
commit 和dispatch的差別在于commit是送出mutatious的同步操作，dispatch是分發actions的異步操作 dispatch：含有異步操作，例如向背景送出資料，寫法： this.$store.dispatch(‘action方法名’,值) commit：同步操作，寫法：this.$store.commit(‘mutations方法名’,值) 這裡用的...擴充用算符 在 methods 中 來調出方法
然後在元件中使用了, 這裡登陸狀态跟使用者資訊2個action都要加載上比登入成功後
還有在通路的時候要擷取狀态,是以也要先執行下在mounted執行可， 最好在 created内執行。不會閃
取值 現在 computed 裡面調出
在視圖直接用
4,後續
有些項目按這個寫法後會提示這個錯誤 WARN Classic mode for store/ is deprecated and will be removed in Nuxt 3.
這樣的話 目錄也就是 1,準備 跟2,編輯2個步驟改一下
換成 :
actions.js
index.js
mutation-types.js
mutations.js 這裡更新狀态可以直接在 内部執行 this.commit(types.ISLOGIN) //及時更新登入狀态
最後效果
demo