Question

我正在使用localStorage将许多对象存储在一个数组中。是否可以从此数组中仅删除一个对象？

如果我使用localstorage.removeItem(keysofthelocalstorage)，则可以删除整个数组；但是，我只想删除不需要的项目。

例如，如果我在本地存储中的条目的密钥为basketContent，而我的值看起来像[{object1},{object2},{object3}]，那么如何删除{object1}？我需要使用其他键来引用数组中的该对象吗？

如果单击“删除”按钮，则可以从数组中获取所需的对象，但是无法删除它。我尝试使用slice，但无法使其正常工作。这是我的代码：

let basketContent = JSON.parse(localStorage.getItem("basketContent")); //Json parse convertie en json
// console.log(basketContent);
if(basketContent !== null) { 
   for(let i = 0; i<basketContent.length; i++) {
      const tabsLine = document.createElement("tr");
      const deleteButton = document.createElement("button");
      deleteButton.setAttribute("class", "btn btn-danger mt-1") ;
      deleteButton.innerHTML = "delete";
      const tbody = document.getElementById("bodytabs");
      tbody.appendChild(tabsLine);
      tabsLine.appendChild(deleteButton);
      console.log(basketContent);
  
      /////////////////////// on click ///////////////////////
      deleteButton.addEventListener("click", function() {
         console.log(baksketContent); //give the objects array
         console.log(basketContent[i]);// give me one object 
      });
   }
} else {
   console.log("empty busket");
}

Answer 1

首先，解析您存储的JSON字符串，删除其中的对象，然后将新数组存储在localStorage中。

const parsed = JSON.parse(localStorage.getItem('basketContent'));
parsed.splice(parsed.indexOf(/*your object*/), 1);
localStorage.setItem('basketContent', JSON.stringify(parsed));

Answer 2

您好，非常感谢您的回答，它能完美地工作，如果有人需要它或它可以帮助别人，我会在代码中加上更正。

const basketContent = JSON.parse(localStorage.getItem("basketContent")); 
   // console.log(basketContent);
    if(basketContent !== null){ 

        for(let i = 0; i<basketContent.length; i++){
        
            const tabsLine = document.createElement("tr");
           
            const deleteButton = document.createElement("button");
            deleteButton.setAttribute("class", "btn btn-danger mt-1") ;
            deleteButton.innerHTML = "delete";
            const tbody = document.getElementById("bodytabs");
            tbody.appendChild(tabsLine); 
            tabsLine.appendChild(deleteButton);
            /////////////////////// on click ///////////////////////         
            deleteButton.addEventListener("click", function(){
                const parsed = JSON.parse(localStorage.getItem('basketContent'));
                parsed.splice(parsed.indexOf(parsed[i]), 1);
                localStorage.setItem('basketContent', JSON.stringify(parsed));
            });           
        }
    }else{
        console.log("empty busket");
      
    }

如何删除和反对本地存储？

2 个答案: