首頁猿問將新元素插入空J(rèn)SON對象

將新元素插入空J(rèn)SON對象

JavaScript

慕碼人8056858 2019-04-18 17:15:24

我正在嘗試將數(shù)據(jù)插入到空的JSON數(shù)組中，但遇到了麻煩。我在構(gòu)造函數(shù)中定義數(shù)組，然后在頁面加載時向后端發(fā)送一些請求，并在獲得響應(yīng)后，我想將新數(shù)組元素添加到現(xiàn)有數(shù)組。這是我正在使用的代碼：constructor() { super(); this.state = { sds: [] } } componentDidMount() { axios.get('/userData', { params: { user: this.props.auth.user.name } }).then(res => { for(var i=0; i<res.data[0].chemID.split(',').length; i++){ if(res.data[0].chemID.split(',')[i] != 0){ axios.get('/chemData', { params: { id: res.data[0].chemID.split(',')[i] } //This is where I want to insert the data }).then(res => this.sds += ({ id: i, title: res.data[0].chemName, selected: false, key: 'sds' })) } } }) }

查看完整描述

4 回答

RISEBY

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

+=不是這樣的。使用擴展運算符復(fù)制數(shù)組的先前內(nèi)容，然后手動添加新對象 -

}).then((res) => {
  const newThing = {
    id: i,
    title: res.data[0].chemName,
    selected: false,
    key: 'sds'
  };
  this.setState(prevState => ({
    sds: [...prevState.sds, newThing]
  }))}

你永遠(yuǎn)不應(yīng)該試圖改變狀態(tài)，總是使用setState。在這種情況下，您可以將函數(shù)作為第一個參數(shù)傳遞，該參數(shù)提供先前的狀態(tài)。這樣，您可以確保this.state.sds保留的內(nèi)容，并將新對象添加到該數(shù)組中。

反對回復(fù) 2019-05-17

楊__羊羊

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

您可以嘗試使用下一個示例：

this.state.sds[this.state.sds.length] = {
          id: i,
          title: res.data[0].chemName,
          selected: false,
          key: 'sds'
        }

將帖子

就像@larz所說，你必須使用setState方法來避免代碼的意外結(jié)果。

var newSds = this.stage.sds;newSds[newSds.length] = {
      id: i,
      title: res.data[0].chemName,
      selected: false,
      key: 'sds'
    };this.setState({ sds: newSds});

你可以得到有關(guān)反應(yīng)生命周期的詳細(xì)信息在這里和“狀態(tài)更新被合并” 在這里

反對回復(fù) 2019-05-17