React JS维护状态

Question

我一直在使用React状态来维护一些数据。对于整数和字符串，它运行良好，但遗憾的是数组不起作用。

在我的组件构造函数中，我有

constructor(props) {
    super(props);

    this.state = {
        terms: 5,
        myArray: []
    }

然后，我试图在componentDidUpdate中维护它

componentDidUpdate() {
    this.state = {
        terms: this.state.terms,
        myArray: this.state.myArray
    }

但myArray: this.state.myArray无效。但是terms: this.state.terms工作正常。

有人可以帮忙！

Answer 1

问题是您是以错误的方式更新state值，更新状态值如下：

this.setState({
     terms: this.state.terms,
     myArray : this.state.myArray
});

根据DOC：

  

不要直接改变this.state，因为之后调用setState（）可能   替换你所做的突变。把它当作状态对待   不可变的。

像这样更新state array，首先使用slice()创建该副本，然后进行更改并使用setState进行更新：

let arr = this.state.myarr.slice();
arr.push('data');
this.setState({arr});

Answer 2

您无法有意使用this.state来更新状态，您必须使用：

this.setState(newStateObject);

Answer 3

你不能直接设置状态，因为它是一个数组，你必须附加值，否则推送值。

尝试类似

的内容

var newArray = this.state.myArray.slice();    
newArray.push("new value");   
this.setState({myArray:newArray})

这里我切片使它变得不可变。