Vue單頁面應(yīng)用保證F5強(qiáng)刷不清空數(shù)據(jù)的解決方案
更新時(shí)間：2018年01月31日 09:43:29 作者：黎明の破曉
最近小編遇到這樣的問題當(dāng)vue單頁面按F5強(qiáng)刷，數(shù)據(jù)就恢復(fù)初始了，這怎么辦呢？下面小編給大家?guī)砹薞ue單頁面應(yīng)用保證F5強(qiáng)刷不清空數(shù)據(jù)的解決方案，感興趣的朋友一起看看吧
問題描述：
Vue單頁面用按F5強(qiáng)刷，數(shù)據(jù)就恢復(fù)初始了，這怎么破？
解決方案：
store.subscribe((mutation, state) => {
sessionStorage.setItem('mobileState', JSON.stringify(state));
})
if (sessionStorage.getItem('mobileState')) {
state = JSON.parse(sessionStorage.getItem('mobileState'));
} else {
state = stateOrg;
}
ps:下面看下Vue父組件接收不到子組件$emit事件的原因分析
通常有兩種情況：
1.事件名稱不全是小寫。事件名稱要求全小寫。
2.不是父子關(guān)系。這里的父子關(guān)系是嚴(yán)格的父子關(guān)系，祖孫關(guān)系也不行。只能一層一層觸發(fā)，這在寫樹形組件時(shí)，很容易掉坑里。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了Vue.js動(dòng)態(tài)組件，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09
Tree shaking 是一種通過清除多余代碼方式來優(yōu)化項(xiàng)目打包體積的技術(shù),就是在保持代碼運(yùn)行結(jié)果不變的前提下,去除無用的代碼,本文給大家介紹Vue 3.0中Treeshaking特性是什么,感興趣的朋友一起看看吧2023-10-10
這篇文章主要介紹了基于vue如何發(fā)布一個(gè)npm包的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
vue3?setup語法糖下父組件如何調(diào)用子組件
這篇文章主要介紹了vue3?setup語法糖下父組件如何調(diào)用子組件問題,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
vue3的ref、isRef、toRef、toRefs、toRaw詳細(xì)介紹
本文詳細(xì)講解了vue3的ref、isRef、toRef、toRefs、toRaw，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-09-09
關(guān)于vue?src路徑動(dòng)態(tài)拼接的小知識
這篇文章主要介紹了vue?src路徑動(dòng)態(tài)拼接的小知識，具有很好的參考價(jià)值，希望對大家有所幫助。2022-04-04
在實(shí)際開發(fā)中,Vue組件之間的數(shù)據(jù)傳遞是最常見的需求,由于組件的作用域相互獨(dú)立,如何在父子、兄弟和跨級組件間傳遞數(shù)據(jù)就顯得尤為重要,本文將詳細(xì)介紹多種Vue組件間傳遞數(shù)據(jù)的方,需要的朋友可以參考下2025-03-03
這篇文章主要介紹了vue返回上一頁(后退)的幾種方法與區(qū)別說明,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
這篇文章主要介紹了vue 設(shè)置背景顏色及透明度的操作，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2021-06-06
vue原理Compile之optimize標(biāo)記靜態(tài)節(jié)點(diǎn)源碼示例
這篇文章主要為大家介紹了vue原理Compile之optimize標(biāo)記靜態(tài)節(jié)點(diǎn)源碼示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07