vuex刷新后數(shù)據(jù)丟失的解決方法
更新時(shí)間：2020年10月18日 15:42:48 作者：git小米粥
這篇文章主要給大家介紹了關(guān)于vuex刷新后數(shù)據(jù)丟失的解決方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
導(dǎo)語(yǔ)：
我們?cè)趯?xiě)vue項(xiàng)目的時(shí)候，經(jīng)常要用到vuex作為內(nèi)存來(lái)儲(chǔ)存，但是我們存放在vuex中的數(shù)據(jù)（用戶數(shù)據(jù)，當(dāng)前頁(yè)面的數(shù)據(jù)等等）在刷新后就會(huì)丟失，那么如何解決呢？超級(jí)簡(jiǎn)單。
1，安裝vuex-persistedstate
npm install --save vuex-persistedstate
2，修改store
import createPersistedState from 'vuex-persistedstate'
const store = new Vuex.Store({
state: {
user: {}, //用戶
},
mutations: {
update_user(state, newuser) {
state.user = newuser
},
},
//把所有數(shù)據(jù)緩存到本地
plugins: [createPersistedState()],
})
export default store;
保存后，再運(yùn)行程序，刷新后vuex中的數(shù)據(jù)就不會(huì)丟失了。
總結(jié)
到此這篇關(guān)于vuex刷新后數(shù)據(jù)丟失解決的文章就介紹到這了,更多相關(guān)vuex刷新數(shù)據(jù)丟失的解決內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了vue3如何獲取綁定頁(yè)面dom元素問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-11-11
Vue?前端路由工作原理hash與history的區(qū)別
這篇文章主要介紹了Vue?前端路由工作原理hash與history的區(qū)別，文章圍繞主題展開(kāi)vue-router的工作原理的簡(jiǎn)單介紹，感興趣的朋友可以學(xué)習(xí)一下2022-07-07
下面小編就為大家分享一篇vue2.0 路由不顯示router-view的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
這篇文章主要介紹了vue組件傳值的11種方式總結(jié)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
這篇文章主要介紹了一篇Vue、React重點(diǎn)詳解大全，文章內(nèi)容詳細(xì)，通過(guò)案例可以更好的理解其相關(guān)知識(shí)，需要的朋友可以參考下2023-01-01
Vue3中內(nèi)置組件Teleport的基本使用與典型案例
Teleport是一種能夠?qū)⑽覀兊哪０逡苿?dòng)到DOM中Vue app之外的其他位置的技術(shù),下面這篇文章主要給大家介紹了關(guān)于Vue3中內(nèi)置組件Teleport的基本使用與典型案例的相關(guān)資料,需要的朋友可以參考下2023-04-04
lodop 取意自“l(fā)oad or print”，是一款優(yōu)秀的 Web 打印控件。本文將在Vue中集成lodop插件實(shí)現(xiàn)打印功能，感興趣的小伙伴可以了解一下2023-01-01
這篇文章主要介紹了Vue中的$nextTick的相關(guān)資料，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-12-12
vue項(xiàng)目實(shí)現(xiàn)webpack配置代理,解決跨域問(wèn)題
這篇文章主要介紹了vue項(xiàng)目實(shí)現(xiàn)webpack配置代理,解決跨域問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
解決vue prop傳值default屬性如何使用,為何不生效的問(wèn)題
這篇文章主要介紹了解決vue prop傳值default屬性如何使用,為何不生效的問(wèn)題。具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-09-09