最近vue項(xiàng)目中遇到了一個比較棘手的問題: 例如第一個頁面是列表,通過選中一行進(jìn)入第二個頁面展示選中內(nèi)容的詳細(xì)信息,這個時候選中的信息保存在vuex.可是這個時候就出現(xiàn)了一個問題,我不能在第二個頁面通過瀏覽器刷新,否則vuex數(shù)據(jù)清空,則第二個頁面將會不知道展示什么內(nèi)容了,顯然這一是嚴(yán)重的bug!? 前端開發(fā)眾所周知在瀏覽器保存數(shù)據(jù)使用session或者cookie,這當(dāng)然是可行的,不過如果每一條需要存儲的信息都去執(zhí)行存儲到session然后在通過session的數(shù)據(jù)賦值到項(xiàng)目對應(yīng)的數(shù)據(jù)下則導(dǎo)致項(xiàng)目看起來過于臃腫了

所以通過各種百度找出來vuex的plugins,可以很好的解決我遇到的問題,vuex的用法就不介紹了,請參考官方文檔

以下步驟是plugins的用法

LStorage.getItem(key): 通過key可以獲取sessionStorage的value

LStorage.setItem(key, val): 存儲數(shù)據(jù)

LStorage.clear(): 清除所有的session記錄

LStorage.removeItem(key): 刪除制定的session記錄

myPlugins函數(shù)里邊的每次頁面刷新的時候會先獲取session的數(shù)據(jù)通過commit方法保存到vuex
store.subscribe方法是在關(guān)聯(lián)store的commit事件,也就是只要你通過commit在修改vuex的數(shù)據(jù)這里的函數(shù)就會監(jiān)聽到,并且執(zhí)行里邊的內(nèi)容保存數(shù)據(jù)到session

vuex添加plugins, myPlugins的參數(shù)可以根據(jù)自己的需要調(diào)整
好了關(guān)于這個問題就這樣解決了,如果有什么不對的地方歡迎指正,獻(xiàn)丑了O(∩_∩)O ~~