因此，我嘗試使用 JSON 更新 LocalStorage 中的元素，但我無法弄清楚我做錯(cuò)了什么。我想添加一個(gè)產(chǎn)品，并在再次添加相同產(chǎn)品時(shí)更新其數(shù)量。第一次添加 X 產(chǎn)品時(shí)，我得到了一個(gè)元素的正確數(shù)量。添加另一個(gè) X 后，數(shù)量將變?yōu)榭铡Ｌ砑尤碌漠a(chǎn)品 Y 將導(dǎo)致多個(gè)重復(fù)的 Y 元素且數(shù)量全部為空。一定有一些邏輯錯(cuò)誤，我似乎無法弄清楚。我懷疑 addToCart 函數(shù)出了問題。由于我是 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貢獻(xiàn)2065條經(jīng)驗(yàn) 獲得超14個(gè)贊
使用以下代碼更改localStorage代碼。問題是您將每次forEach迭代中的所有產(chǎn)品推送到本地存儲(chǔ)。
嘗試下面的代碼。
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貢獻(xiàn)1111條經(jīng)驗(yàn) 獲得超0個(gè)贊
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));
}
這解決了重復(fù)問題，但在添加現(xiàn)有產(chǎn)品時(shí)仍然存在數(shù)量為空的問題。
- 2 回答
- 0 關(guān)注
- 162 瀏覽
添加回答
舉報(bào)
0/150
提交
取消