setState在嵌套数组中的反应

时间:2019-01-07 18:10:51

标签: reactjs nested state setstate

我有一个带有两个数组的React状态对象。

this.state = {
  data2: {
    nodes: [{id: 'input'}],
    links: []
  },
};

我想在用户执行某些操作后向这些数组添加新值,但是我没有找到正确的方法。到目前为止,我已经尝试过这样的事情:

this.setState([...this.state.data2, {nodes: [...this.state.nodes,{ id: 'input2'}]}]);

关于如何实现此目标的任何想法?

2 个答案:

答案 0 :(得分:2)

我会推荐这样的东西

this.state = { 
    data2: {
    nodes: [],
    links: []
  },
};

设置状态时,您不必在setState function

中使用this关键字
this.setState({ data2:{ nodes: [{id:'input1'},{id:'input2'}]} })

您也可以将对象推入节点数组

let temp = data2
temp.nodes.push({id:'input3'})
this.setState({ data2:temp })

答案 1 :(得分:1)

可以用两种简单的方法完成。您使用传播运算符所做的一项。像这样的东西

this.setState({data2: {...this.state.data2, nodes: [{id: "input1"}]} });

或者您可以像这样使用[Object.assign()][1]

this.setState({data2: Object.assign({}, this.state.data2, nodes: [{id: "input1"}])});