vue中如何使用localStorage实现在界面刷新时清除数据

发布时间:2022-05-05 18:04:00 作者:iii
来源:亿速云 阅读:862

本文小编为大家详细介绍“vue中如何使用localStorage实现在界面刷新时清除数据”,内容详细,步骤清晰,细节处理妥当,希望这篇“vue中如何使用localStorage实现在界面刷新时清除数据”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

vue中使用方法:

1、新建一个store.js文件

localStorage只能存储字符串,非字符串的数据在存储之前会被转换成字符串。在存储一些复杂数据类型时可能有些麻烦,下面方法是先使用JSON.stringfy()方法将其转换为字符串后存储,读取时使用JSON.parse()方法进行还原。

const IDLIST_KEY = 'idlist'; //定义常量保存键值

export default {

 saveIDlist(data){

 window.localStorage.setItem(IDLIST_KEY,JSON.stringify(data)); 

 },

 fetchIDlist(){

 return JSON.parse(window.localStorage.getItem(IDLIST_KEY)|| '[]');

 }

}

2、引入js文件:

vue中如何使用localStorage实现在界面刷新时清除数据

3、使用:

store.saveIDlist(selectIDlist); //保存

selectIDlist = store.fetchIDlist(); //读取

读到这里,这篇“vue中如何使用localStorage实现在界面刷新时清除数据”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。

推荐阅读:
  1. Winform刷新时界面假死、闪烁怎么办
  2. 详解vue中localStorage的使用方法

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

vue localstorage

上一篇:vue中如何利用watch监听数据变化

下一篇:Vue怎么利用Blob下载原生二进制数组文件

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》