第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

帶有 redux 的本地存儲(chǔ)無(wú)法按預(yù)期工作

帶有 redux 的本地存儲(chǔ)無(wú)法按預(yù)期工作

繁星淼淼 2022-06-16 16:45:04
我是 JavaScript 的初學(xué)者,我正在使用 React 和 Redux 開(kāi)發(fā)電子商務(wù)測(cè)試應(yīng)用程序,我需要在購(gòu)物車(chē)上保存數(shù)據(jù)(為此我使用本地存儲(chǔ))。當(dāng)我將商品添加到購(gòu)物車(chē)時(shí),它們存儲(chǔ)在本地存儲(chǔ)中,當(dāng)我刷新頁(yè)面時(shí),數(shù)據(jù)仍保留在本地存儲(chǔ)中。當(dāng)我在頁(yè)面刷新后嘗試將其他項(xiàng)目添加到購(gòu)物車(chē)時(shí)出現(xiàn)問(wèn)題,而不是添加到最初存在的項(xiàng)目中,它從零開(kāi)始添加。這是一個(gè)代碼片段:我的 REDUX 行動(dòng)const arr = [];export const addItem = (itemsAddedToCart) => {  const id = Math.random();  arr.push({ ...itemsAddedToCart, id: id });  const test = JSON.stringify(arr);  localStorage.setItem("test", test);  return {    type: "ADD_ITEM",    payload: { ...itemsAddedToCart, id: id },  };};PS對(duì)不起我的英語(yǔ)不好
查看完整描述

1 回答

?
慕森卡

TA貢獻(xiàn)1806條經(jīng)驗(yàn) 獲得超8個(gè)贊

看起來(lái)localStorage.setItem()會(huì)覆蓋本地存儲(chǔ)中已有的內(nèi)容。

要在不刪除舊條目的情況下更新本地存儲(chǔ)中的內(nèi)容,您可以先讀取本地存儲(chǔ)內(nèi)容,合并新項(xiàng)目并寫(xiě)入存儲(chǔ)。


const arr = [];

export const addItem = (itemsAddedToCart) => {

  const id = Math.random();


  arr.push({ ...itemsAddedToCart, id: id });

  //get the new elements' ids to a set

  const ids = new Set(arr.map(d => d.id));



  //read stored items from storage and join them to arr

  const storedItems = localStorage.getItem("test");

  if(storedItems) {

    const storedItemsParsed = JSON.parse(storedItems);

    // if the item is not in new items, add them to arr

    arr = [..arr, ...storedItemsParsed.filter(item=> !ids.has(item.id)) ]

  }



  const test = JSON.stringify(arr);

  localStorage.setItem("test", test);

  return {

    type: "ADD_ITEM",

    payload: { ...itemsAddedToCart, id: id },

  };

};


查看完整回答
反對(duì) 回復(fù) 2022-06-16
  • 1 回答
  • 0 關(guān)注
  • 100 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)