在入口文件對刷新事件進(jìn)行監(jiān)聽,刷新是觸發(fā)beforeunload
,然后將整個vuex信息放入瀏覽器本地存儲中
mounted () {
window.addEventListener('beforeunload', () => {
sessionStorage.setItem('store', JSON.stringify(this.$store.state))
})
}
刷新結(jié)束后,會觸發(fā)vue鉤子created
,判斷本地存儲是否有store
,如果有,則利用vue中的this.$store.replaceState
,官網(wǎng)介紹替換 store 的根狀態(tài)俗扇,僅用狀態(tài)合并或時光旅行調(diào)試镣屹。
可以直接覆蓋state,利用Object.assign對狀態(tài)管理器進(jìn)行合并或覆蓋
created () {
if (sessionStorage.getItem('store')) {
this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem('store'))))
sessionStorage.removeItem('store')
}
}
引用:
vuex冷門實例方法replaceState额嘿、watch瘪匿、subscribe潦蝇、subscribeAction等介紹