现在前端做数据存储,跨页面传值,localStorage是一个很好的办法,以键值对的办法存储,也方便取值赋值。利用getItem()方法可以访问到存在浏览器 localStorage 中的数据工具,它以 key 作为参数,并且返回与 key 相对应的 value。
结合到实际项目中效果不错,附代码:
var jsonArray = [{"id":"sys-xmbh","show":true,"isSys":true},{"id":"sys-xmmc","show":true,"isSys":true}];/=====js 如果有本地存储就调取本地存储 没有 就调取一段默认json=====/function getData(){// 本地存储的键名var storageKey = "myData";// 考试测验从本地存储中获取数据var storedData = localStorage.getItem(storageKey);// 检讨本地存储是否有值// if (storedData) {// // 解析JSON字符串为工具// storedData = JSON.parse(storedData);// } else {// // 没有本地存储,利用默认的JSON工具// storedData = jsonArray;// }return storedData ? JSON.parse(storedData) : jsonArray;}var storedData = getData();// 利用获取到的数据console.log(storedData); /==========修正数据 保存============/var storedData = getData();// 要修正name为'Bob'的工具的age值为35var updatedArray = storedData.map(item => {if (item.id === id) {return { ...item, show: data.elem.checked }; // 利用展开运算符复制当前工具,并修正age属性}return item; // 对不须要修正的工具保持原样});console.log(updatedArray);// 将JSON工具转换为字符串var jsonString = JSON.stringify(updatedArray);// 存储到localStoragelocalStorage.setItem("myData", jsonString);// 从localStorage中检索//var retrievedString = localStorage.getItem("myData");// 将字符串转换回JSON工具//var retrievedObject = JSON.parse(retrievedString);//console.log(retrievedObject);/========打消数据====/localStorage.removeItem('myData');
切图网-我的前端外包首选。

标签:localStorage, 本地存储