如何在Vue项目中使用localStorage存储数据

这篇文章给大家介绍如何在Vue项目中使用localStorage存储数据,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

成都创新互联公司-专业网站定制、快速模板网站建设、高性价比二七网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式二七网站制作公司更省心,省钱,快速模板网站建设找我们,业务覆盖二七地区。费用合理售后完善,十年实体公司更值得信赖。

1.先组织出一个最新评论数据对象 

var comment = {id:Date.now(), user:this.user, content:this.content}

2. 把得到的评论对象,保存到localStorage中 

1.localStorage只支持存字符串数据,保存先调用JSON.stringify转为字符串

2.在保存最新的评论数据之前,要先从localStorage获取到之前的评论数据(string)转换为一个数组对象,然后把最新的评论,push到这个数组

3.如果获取到的localStorage中的评论字符串为空,不存在,则可以返回一个'[]'让JSON.parse去转换

4.把最新的评论列表数组,再次调用JOSN.stringify转为数组字符串,然后调用localStorage.setItem()保存


 
  
  
 

 
  
 
  
   
    评论人:{{item.user}}
     {{item.content}}
   
  
 
    
                 
                 
            
  
 

可以打开开发者模式查看localStorage保存的数据

如何在Vue项目中使用localStorage存储数据

关于如何在Vue项目中使用localStorage存储数据就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


网页名称:如何在Vue项目中使用localStorage存储数据
网站网址:http://csdahua.cn/article/jdcchj.html
扫二维码与项目经理沟通

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流

其他资讯