当前位置:首页 > vue.js > 正文内容

vuex刷新状态消失的解决办法

自由小鸟6年前 (2019-11-19)vue.js3193

vuex做数据管理非常好,但是唯一美中不足的地方,就是当页面刷新的时候状态保存不下来,但是工作业务中,常常会遇到,可能需要把状态保留下来的情况

那在这种情况下可以使用方案:

在 app.vue中的created函数中写如下代码:localstorage和sessionStorage都可以

//在页面加载时读取sessionStorage里的状态信息

if (sessionStorage.getItem("store") ) {

    this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))

}


//在页面刷新时将vuex里的信息保存到sessionStorage里

window.addEventListener("beforeunload",()=>{

    sessionStorage.setItem("store",JSON.stringify(this.$store.state))

})


版权声明:本文由Web学习之路发布,如需转载请注明出处。

本文链接:https://www.webge.net/?id=78

“vuex刷新状态消失的解决办法” 的相关文章

vue-router 路由的配置

vue-router 路由的配置

最好定义一个专门的路由配置文件来管理路由地址  接下来在点击的元素上开始设置路由path接收的 链接地址 例如以下...

vue-router 路由几种模式,分别什么用法

vue-router 默认 hash 模式 .  http://music.163.com/#/friend还有一种是history模式。  http://music.163.com/friendhash模式背后的原理是onhashchange事件,...

watch监听的几种写法

var vm = new Vue({ data: { a: 1, b: 2, c: 3, d: 4, e: { f: { g: 5 } } }, watch: { a...

vue 公告滑动效果

vue 公告滑动效果

适应只显示一条 <div class="marquee_box"> <ul class="marquee_list" :class="{marquee_top:animate}"> &l...

vue 时间戳转今天,昨天,以前时间

filters:{ formatDate(date) { const lastDate = new Date(date); lastDate.setHours(0); lastDate.setMinutes(0); lastDate.setSecon...