解決vue 刷新數據丟失的問題

用到的技術

1. vuex 全局數據
2. window.addEventListener("beforeunload",()=>{ }) 監聽頁面刷新
3. 使用localStorage 臨時存儲數據

思路：在頁面刷新的時候，將vuex中的數據存儲到localstorage ，然后刷新結束后再將localstorage里的數賦值給store並清楚localstorage

代碼

//js 監聽頁面alert刷新  window.addEventListener("beforeunload", () => { localStorage.setItem("stateInfo", JSON.stringify(this.$store.state)); }); if (localStorage.getItem("stateInfo")) { this.$store.replaceState( Object.assign( {}, this.$store.state, JSON.parse(localStorage.getItem("stateInfo")) ) ); } localStorage.removeItem("stateInfo"); console.log("名字", this.$store.state);