首页 > 解决方案 > 如何删除或避免 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);

标签: javascriptlocal-storage

解决方案


从 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);
}

推荐阅读