如何仅删除在 localStorage 中多次出现的一个特定数据

Question

我有一些物品，我通过将它们与它们的 ID 一起存储在 localStorage 中来添加到购物车。$(document).on('click', '.set-cart-info', function () {    // We retrieve the product id which is stored in the url    var url_id = window.location.search;    var id = url_id.split('?id=').pop();    // We retrieve the data from the localStorage    var cartItems = localStorage.getItem('teddy_id');    // If there is no data, we create an array    cartItems = cartItems ? cartItems.split(',') : [];    // Add the new data to the array    cartItems.push(id);    // We save the data in the localStorage    localStorage.setItem('teddy_id', cartItems.toString());});在 console.log 我得到这个：localStorage.getItem('teddy_id')"5beaacd41c9d440000a57d97,5beaabe91c9d440000a57d96,5beaabe91c9d440000a57d96,5beaaa8f1c9d440000a57d95,5beaabe91c9d440000a57d96,5beaaa8f1c9d440000a57d95,5beaabe91c9d440000a57d96,5beaacd41c9d440000a57d97,5beaaa8f1c9d440000a57d95,5beaaa8f1c9d440000a57d95,5beaaa8f1c9d440000a57d95,5beaabe91c9d440000a57d96,5beaacd41c9d440000a57d97,5beaacd41c9d440000a57d97,5beaacd41c9d440000a57d97,5beaacd41c9d440000a57d97,5beaacd41c9d440000a57d97,5beaaa8f1c9d440000a57d95"然后，我添加了通过检索产品 ID 并将其添加到 localStorage 来添加或删除产品数量的可能性，我的问题如下：当我检索 ID 以在 localStorage 中获取它时，它会删除所有项目这个 ID，我希望它只删除一个。这是允许添加数量的代码，以及应该修改的代码，以便它也只删除一个：$(document).on('click', '.add_qty', function () {    // We retrieve the product id which is stored in the class    var split_class = this.className.split(' ');    var this_id = split_class[1];    var cartItems = localStorage.getItem('teddy_id');    cartItems = cartItems ? cartItems.split(',') : [];    cartItems.push(this_id);    localStorage.setItem('teddy_id', cartItems.toString());});$(document).on('click', '.remove_qty', function () {    // We retrieve the product id which is stored in the class    var split_class = this.className.split(' ');    var this_id = split_class[1];    var cartItems = localStorage.getItem('teddy_id');    cartItems = cartItems ? cartItems.split(',') : [];});

Answer 1

永远记住数组方法是你的朋友。array.prototype.find()一种方法是将with的使用结合起来，array.prototype.splice()如下所示：

cartItems.find( ( item, i ) => {

   if ( item == this_id ) {

      cartItems.splice( i, 1 );

      return true;

   }

   return false;

} );

这样，它只会删除它遇到的第一个匹配项目。

Answer 2

你的问题是使用本地存储，一旦你存储 ID 数组，它就会以数组的形式存储，同时检索你需要获取字符串 json 解析它的数据，然后运行所需的操作。检查这个例如。