因此，我嘗試使用 JSON 更新 LocalStorage 中的元素，但我無法弄清楚我做錯了什么。我想添加一個產品，并在再次添加相同產品時更新其數量。第一次添加 X 產品時，我得到了一個元素的正確數量。添加另一個 X 后，數量將變?yōu)榭铡Ｌ砑尤碌漠a品 Y 將導致多個重復的 Y 元素且數量全部為空。一定有一些邏輯錯誤，我似乎無法弄清楚。我懷疑 addToCart 函數出了問題。由于我是 JavaScript 和 JQuery 的新手，因此非常感謝任何幫助。謝謝。$(document).ready(function() { // caching let $table = $(".shoe-table"); fetch("shoes.json") .then(resp => resp.json()) .then(data => { let shoes = data.shoes; let rows = [1, 2, 3]; let shoeCard = ""; let products = JSON.parse(localStorage.products || "[]"); console.log(products); function addToCart(cBtn) { let clickedButton = $(cBtn); let buttonID = clickedButton.attr("id"); let thisInput = $("#" + clickedButton.attr("id") + ".input-form").children("input"); let newShoe = { id: buttonID, image: shoes[buttonID].image, name: shoes[buttonID].name, price: shoes[buttonID].price, quantity: parseInt(thisInput.val()) }; if (products.length != 0) { products.forEach(shoe => { if (shoe.name == newShoe.name) { shoe.quantity += newShoe.quantity; localStorage.setItem("products", JSON.stringify(products)); console.log(products); } else { products.push(newShoe); localStorage.setItem("products", JSON.stringify(products)); } }); } else { products.push(newShoe); localStorage.setItem("products", JSON.stringify(products)); } }
2 回答
翻翻過去那場雪
TA貢獻2065條經驗 獲得超14個贊
使用以下代碼更改localStorage代碼。問題是您將每次forEach迭代中的所有產品推送到本地存儲。
嘗試下面的代碼。
if (products.length != 0) {
let isExists = products.some(shoe => shoe.name === newShoe.name);
if (!isExists) {
products.push(newShoe);
} else {
products = products.map(shoe => {
if (shoe.name == newShoe.name && !isNaN(newShoe.quantity)) {
shoe.quantity += newShoe.quantity;
return shoe;
}
return shoe;
});
}
localStorage.setItem("products", JSON.stringify(products));
} else {
products.push(newShoe);
localStorage.setItem("products", JSON.stringify(products));
}
catspeake
TA貢獻1111條經驗 獲得超0個贊
if (products.length != 0) {
for (let index = 0; index < products.length; index++) {
if (products[index].name == newShoe.name) {
products[index].quantity += newShoe.quantity;
localStorage.setItem("products", JSON.stringify(products));
break;
} else{
products.push(newShoe);
localStorage.setItem("products", JSON.stringify(products));
break;
}
}
} else {
products.push(newShoe);
localStorage.setItem("products", JSON.stringify(products));
}
這解決了重復問題，但在添加現有產品時仍然存在數量為空的問題。
- 2 回答
- 0 關注
- 177 瀏覽
添加回答
舉報
0/150
提交
取消