Question

我正在为我的投资组合项目编写用户购物车。我想保存产品的ID以及存储中有多少个特定ID。我希望我的数据看起来像这样：

[
  {id: '64783', count: '5'},
  {id: '111', count: '50'},
]

由于数据在localStorage中，因此我已经对用户JSON进行了解析和字符串化，但是我不知道如何在上面列出的LS中实现数据模型。当然，即使ID相同，我也可以存储多个ID，然后在显示购物车时对其进行过滤，但我认为这不是最佳选择。

export const addToCart = (id, userIsLoggedIn) => {
    let cart = [];
    let itemToAdd = {
        id,
        count: 0,
    };
    if (localStorage.getItem('cart')){
        cart = JSON.parse(localStorage.getItem('cart'));
        let count = cart.filter(el => el.id === id).length
        console.log(count)
    }
    cart.push(itemToAdd);
    localStorage.setItem('cart', JSON.stringify(cart))
    console.log(localStorage.getItem('cart'))
};

我可以正确获取count的值，但是我的函数仍然会附加整个对象，而不是更新项目的count。

我该如何解决？

Answer 1

此代码将

从cart读localStorage
检查ID是否在购物车中
如果有，请增加计数
否则添加带有count：1的项目
如果localStorage为空，则会创建整个对象

所以，代码是

export const addToCart = (id, userIsLoggedIn) => {
    let cart = [];
    let itemToAdd = {
        id,
        count: 1,
    };
    if (localStorage.getItem('cart')) {
        cart = JSON.parse(localStorage.getItem('cart'));
        let item = cart.find(el => el.id === id);
        if (!item) {
            cart.push(itemToAdd);
        } else {
            item.count ++;
        }
    } else {
        cart = [itemToAdd];
    } 
    localStorage.setItem('cart', JSON.stringify(cart))
    console.log(localStorage.getItem('cart'))
};

或者

export const addToCart = (id, userIsLoggedIn) => {
    let cart = {};
    if (localStorage.getItem('cart')) {
        cart = JSON.parse(localStorage.getItem('cart'));
    }
    cart[id] = (cart[id] || 0) + 1;
    localStorage.setItem('cart', JSON.stringify(cart));
    console.log(localStorage.getItem('cart'));
};

在这种方法中，购物车的内容就像

{
    "1111": 2,
    "1234": 1
}

等

如何计算localStorage中的特定ID？

1 个答案: