localStorage 不方便存储数组时的替代方法
项目背景是需要将搜索历史存储到localStorage中,
需要存储id和name,每次存储时都需要在记录中多加一条,用数组push显然是比较好的方法,但localStorage不方便存储数据,于是就想到来存储字符串,用‘逗号’隔开,然后再split('',")转化成数组,代码如下:
let history = localStorage.historyData?localStorage.getItem("historyData"):'';
let item = data + name;
let hisData = localStorage.historyData?history +','+item:item
localStorage.setItem('historyData',hisData)
取到的数据以及转换如下:

这样就可以完成需求,
ps:localStorage需要手动清除才会清空,需要调用
localStorage.clear();
}
localStorage 不方便存储数组时的替代方法的更多相关文章
- ArrayList中存储数组时需要注意到的问题
因为数组的地址是不会发生变化的,每次在数组中的内容改变后,将数组添加到ArrayList中时,会导致ArrayList中的每个内容都是最后添加进去的数据.案例如下所示: Object []objs = ...
- localStorage存、取数组
localStorage存储数组时需要先使用JSON.stringify()转成字符串,取的时候再字符串转数组JSON.parse(). var arr=[1,2,3,4]; localStorage ...
- JSP中的“小饼干”Cookie,用来存储数组的方式(下方已String类型的数组为例:)
1.Cookie常用方法中,存储数据的方式: Cookie cookie = new Cookie("key","Value"); response.addCo ...
- 使用sessionStorage、localStorage存储数组与对象
先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...
- 使用sessionStorage、localStorage存储数组与对象(转)
http://my.oschina.net/crazymus/blog/371757 使用sessionStorage.localStorage存储数组与对象 发表于3个月前(2015-01-26 1 ...
- localStorage存储对象,sessionStorage存储数组对象
前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听,数据只要发生变化就能很方便的自动渲染页面.但随即出现的问题是,之前用户操作的样式都会被重置掉. 例如我勾选了几个 ...
- localStorage存储数组,对象,localStorage,sessionStorage存储数组对象
localStorage存储数组,对象,localStorage,sessionStorage存储数组对象 前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听, ...
- localStorage存储JSON对象的小方法
有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有: 1 缓存数据 2 减少对内存的占用 但是,storage只能存储字符串的数据,对于JS中常用的数 ...
- List、Map、Set三个接口存储元素时各有什么特点?
List.Map.Set三个接口存储元素时各有什么特点? 解答: 1)List是有序的Collection,使用此接口能够精确的控制每个元素插入的位置.用户能够使用索引(元素在List中的位置,类似于 ...
随机推荐
- lua迭代器和泛型for浅析
(一) 首要概念要理清: 1. 在lua中,函数是一种"第一类值",他们具有特定的词法域."第一类值"表示在lua中函数与其他传统类型的值(例如数字和字符串)具 ...
- POJ 2018 Best Cow Fences(二分+最大连续子段和)
Best Cow Fences Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 14601 Accepted: 4720 Desc ...
- Socket 服务端使用多线程实现多客户端通讯实例
socket通信原理 Java多线程实现Socket通讯 1.服务端 import java.io.IOException; import java.net.ServerSocket; import ...
- 10.19stark组件开发(三)
2018-10-19 15:42:15 2018-10-19 18:21:33 我觉得现在主要是学一种解决问题的思路,也就是逻辑或者说是算法!!!! 要有对代码的感触!要用面向对象对类进行封装!!Dj ...
- A - River Hopscotch
Every year the cows hold an event featuring a peculiar version of hopscotch that involves carefully ...
- oracle相关的知识
01.表空间的创建与删除 Spool 目录 (把sql语句都记录在txt文件中)spool e:\xxx.txtSpool off 结束 SQL> --清除屏幕信息SQL> cle ...
- mysql 登录远程数据库
mysql -h${hostIP} -P${hostPort} -u${userName} -p${passwd}
- 浅析vue的双向数据绑定
vue 的双向数据绑定是基于es5的 object对象的defineProperty属性,重写data的set和get函数来实现的.1.defineProperty 数据展示 Object.defin ...
- [No0000109]Git2/9-安装Git
最早Git是在Linux上开发的,很长一段时间内,Git也只能在Linux和Unix系统上跑.不过,慢慢地有人把它移植到了Windows上.现在,Git可以在Linux.Unix.Mac和Window ...
- A little issue in Mathematical Thought from Ancient to Modern Times, Vol. 3
At P985 of the book, says But there are cuts that are not determined by rational numbers. If we put ...