本文就以vuex在使用者登入、退出時的使用為例。
一、在 main.ts引用
二、store檔案目錄
三、security.ts裡面的具體內容
/** 用於儲存當前使用者登入狀態 */
import from 'vuex';
import from '@/domain/security';/** 此檔案中定義了使用者資料結構,typescript的特色 */
inte***ce state ;
const sskey = 'ssns.security.authorizeduser'
const usercache = sessionstorage.getitem(sskey)
const state: state =
const mutations = ,
logout(state: state) ,
};const actions = ,
logout(context: actioncontext) ,
};export default ;
四、在具體檔案中的使用
此時使用者登入時的相關資訊就通過vuex中的login()存到state和session中,在其他檔案中需要用到某些資訊時直接取就ok了。
這是每個檔案用到vuex必須引用的內容。
如果只是需要state中的值的話這樣就可以了。
在需要name的地方通過this.authorizeduser.name就可以了,
是不是很方便啊?
在vue專案裡面使用vuex
安裝成功之後在 vue專案的目錄建立store資料夾 在main.js檔案裡面引入store.js檔案 import vue from vue import router from router import store from store store vue.config.productiont...
在 Vue 中手寫乙個微型 Vuex
vuex 是乙個專為 vue.js 應用程式開發的狀態管理模式,在vue專案中,有些資料需要在很多元件內進行傳遞,為了方便管理和維護,我們就需要這樣乙個工具來管理這些資料,通常情況下我們就會選擇vuex。但是正如vuex官網所說 vuex 可以幫助我們管理共享狀態,並附帶了更多的概念和框架。這需要對...
在Vue中使用Vuex進行狀態管理指南
1 vuex是什麼?vuex 是乙個專為 vue.js 應用程式開發的 狀態管理模式 它採用集中式儲存管理應用的所有元件的狀態,並以相應的規則保證狀態以一種可 的方式發生變化。2 為什麼需要vuex?vuex解決了什麼問題?當我們的應用遇到多個元件共享狀態時,單向資料流的簡潔性很容易被破壞 對於問題...