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

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

為什么我的狀態(tài)更新會覆蓋現(xiàn)有數(shù)據(jù)值?

為什么我的狀態(tài)更新會覆蓋現(xiàn)有數(shù)據(jù)值?

萬千封印 2023-05-11 16:43:01
下面我嘗試獲取用戶數(shù)據(jù)當(dāng)前狀態(tài)的副本,以及從 json 文件中提取的新發(fā)票模板的副本,該文件的鍵值對全部為空。然后我將模板 invoiceID 更改為比 idx 多 1(這是從子組件發(fā)送的數(shù)字值,它是狀態(tài)中所有發(fā)票的長度)。最后,我獲取用戶數(shù)據(jù)的副本并添加到新模板中,然后將新用戶數(shù)據(jù)保存回狀態(tài),以便它可以在我的列表中更新。  createInvoice = idx => {    let newUserData = this.state.userData;    let template = UsersJSON[0].invoices[0];    template.invoiceID = idx + 1;    newUserData.invoices.push(template);    this.setState({      userData: newUserData    });  }這是我登錄時所有數(shù)據(jù)的當(dāng)前狀態(tài):在我點擊 New Invoice + 一次之后:在我多次點擊 New Invoice + 后,問題開始出現(xiàn):只有所有新的發(fā)票 ID 會不斷更新為最新和最好的 ID。我真的不知道為什么會這樣。任何幫助,將不勝感激!我在 github 上的項目的鏈接(查看 invoices 分支,而不是 master): https ://github.com/Brent-W-Anderson/invoice-pdf/tree/invoices
查看完整描述

2 回答

?
12345678_0001

TA貢獻(xiàn)1802條經(jīng)驗 獲得超5個贊

問題

  1. 您沒有正確地為狀態(tài)和反應(yīng)協(xié)調(diào)創(chuàng)建新的數(shù)組引用。

  2. 您還改變了模板引用對象。

代碼

createInvoice = idx => {

  let newUserData = this.state.userData; // <-- saved state reference

  let template = UsersJSON[0].invoices[0];


  template.invoiceID = idx + 1; // <-- template mutation

  newUserData.invoices.push(template); // <-- mutated state


  this.setState({

    userData: newUserData // <-- saved state reference back into state

  });

}

解決方案

創(chuàng)建您打算更新的所有狀態(tài)的淺表副本。


createInvoice = idx => {

  let newInvoices = [...this.state.userData.invoices]; // <-- create a new array reference

  let template = {

    ...UsersJSON[0].invoices[0], // <-- create new template object reference

  };


  template.invoiceID = idx + 1;

  newInvoices.push(template);


  this.setState({

    userData: {

      ...state.userData,

      invoices: newInvoices,

    }

  });

}

添加到狀態(tài)的一種稍微更反應(yīng)性的方法是映射來自先前狀態(tài)的數(shù)據(jù)并在模板中傳播,這樣您也不會改變它。


createInvoice = idx => {

  this.setState(prevState => ({

    userData: {

      ...prevState.userData,

      invoices: [

        ...prevState.userData.invoices,

        {

          ...UsersJSON[0].invoices[0],

          invoiceID: idx + 1,

        },

      ],

    },

  }));

}


查看完整回答
反對 回復(fù) 2023-05-11
?
蝴蝶不菲

TA貢獻(xiàn)1810條經(jīng)驗 獲得超4個贊

你想在更新之前復(fù)制一個狀態(tài)對象(在 JS 數(shù)組中是對象)。也許let newUserData = [...this.state.userData]是避免此錯誤的方法,但您可能需要“深拷貝”。

查看完整回答
反對 回復(fù) 2023-05-11
  • 2 回答
  • 0 關(guān)注
  • 151 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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