• 网站首页
• 网站建设
• 短视频
• 网站推广
• 网站模板
• 客户案例
• 资讯动态
• 关于我们

本地state丢失怎么解决？

. 产生原因

store里的数据是保存在运行内存中的,当页面刷新时，页面会重新加载vue实例，store里面的数据就会被重新赋值。

2. 解决办法

方法一

将State里的数据保存一份到本地存储(localStorage、sessionStorage、cookie）中

让页面在刷新前存store到localStorage中。当然，在页面刷新时还要读localStorage中的数据到store中，读取和储存都写在app.vue中。

export default {

name: "App",

created() {

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

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

localStorage.setItem("messageStore", JSON.stringify(this.$store.state));

});

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

localStorage.getItem("messageStore") &&

this.$store.replaceState(

Object.assign(

this.$store.state,

JSON.parse(localStorage.getItem("messageStore"))

)

);

}

};

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

方法二

1、安装

npm install --save vuex-persistedstate

1

1

2、在store.js中引入

版权说明：
本网站凡注明“广州京杭 原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。