javascript - 如何删除或避免 LocalStorage 中的重复值
问题描述
当用户单击按钮时,它将在 LocalStorage 中存储一些值,如果用户再次单击相同的按钮,它将再次在 LocalStorage 中存储相同的值,我如何删除或避免在 LocalStorage 中重复相同的值?!
谁能帮帮我吗 :)
HTML:
<a onclick="AddToCart('ae90ac1a-64c4-49a7-b588-ae6b69a37d47');">Add to Cart</a>
<a onclick="AddToCart('3e58aa74-4585-4bee-b2e0-ed39a1d95442');">Add to Cart</a>
JavaScript:
function AddToCart(varer) {
var itemsLocalStorage = JSON.parse(localStorage.getItem("itemsline") || "[]");
itemsLocalStorage.push(varer);
localStorage.setItem("itemsline", JSON.stringify(itemsLocalStorage));
}
LocalStorage(在用户点击之前):
[]
LocalStorage(当用户单击时):
["ae90ac1a-64c4-49a7-b588-ae6b69a37d47"]
LocalStorage(当用户再次点击时):
["ae90ac1a-64c4-49a7-b588-ae6b69a37d47","ae90ac1a-64c4-49a7-b588-ae6b69a37d47"]
我试过filter
但由于某种原因它不起作用:
itemsLocalStorage = itemsLocalStorage.filter(e => e === varer);
解决方案
从 localStorage 中获取数组,如果在该数组中尚未找到该值,则将其推送到数组中,如果我们推送,则更新 localStorage。
var array = JSON.parse(window.localStorage.getItem("itemsline")) || [];//the "|| []" replaces possible null from localStorage with empty array
var value = "some value";
if(array.indexOf(value) == -1){
array.push(value);
window.localStorage.setItem("itemsline", JSON.stringify(array));
}
这是相同代码的一个版本,它更能解释它的工作原理:
//All values stored in localStorage are strings.
//Grab our itemsline string from localStorage.
var stringFromLocalStorage = window.localStorage.getItem("itemsline");
//Then parse that string into an actual value.
var parsedValueFromString = JSON.parse(stringFromLocalStorage);
//If that value is null (meaning that we've never saved anything to that spot in localStorage before), use an empty array as our array. Otherwise, just stick with the value we've just parsed out.
var array = parsedValueFromString || [];
//Here's the value we want to add
var value = "some value";
//If our parsed/empty array doesn't already have this value in it...
if(array.indexOf(value) == -1){
//add the value to the array
array.push(value);
//turn the array WITH THE NEW VALUE IN IT into a string to prepare it to be stored in localStorage
var stringRepresentingArray = JSON.stringify(array);
//and store it in localStorage as "itemsline"
window.localStorage.setItem("itemsline", stringRepresentingArray);
}
推荐阅读
- javascript - 为什么安装一个 npm 包会重新安装我所有的其他包?
- c++ - 将“new”与 initializer_list 一起使用不会分配字符串值,而 int 值有效
- heroku - 使用 MONGODB ATLAS 将 STRAPI 部署到 Heroku 失败
- three.js - 在 WebGL / Threejs 中的变形矩形内使用正确的 UV 剪辑纹理
- python - Kivy - 在 .py 文件中的另一个屏幕中使用来自一个屏幕的 TextInput 的文本
- c# - MongoDB C# 驱动程序 - 如何在 .NET 中对连接的集合强制执行投影?
- excel - 设置 vba 变量不显示在参考变量的位置
- mysql - 在两列上加入两个数据集sql domo
- c# - Tab 聚焦整个 DataGrid,而不是 DataGrid 中的任何项目(将使用箭头/页面按钮在 DataGrid 中导航)
- python - 将 Numpy 二维数组转换为映射的字典列表