React怎么修改state数组中的数据？

Question

var deleted = xhr.responseText;
            if (deleted == 'true') {
                this.state.comments.remove(2); //这行报错，没有remove 这个方法。
                this.setState(this.state.comments);
            }

deleted是server返回的状体，如果为true则删除state.comments对应的数据。comments是一个数组，这样写不对，应该怎么写呢？

Answer 1

数组是一个引用，React 执行 diff 算法时比较的是两个引用，而不是引用的对象。所以直接修改原对象，引用值不发生改变的话，React 不会重新渲染。因此，修改状态的数组或对象时，最好返回一个新的数组或对象。另外，使用不可变对象，如 immutable.js，可以在这方面作更多优化。

this.setState({
    comments: this.state.comments.remove(2).slice(0)
})

Answer 2

this.setState({commnets: []});

把你的数组直接更新成空，这样就可以了

setState方法传入的是一个要更新的对象，key对应state里面的key，value对应你想要修改后的value

不要对state直接操作

希望能帮到你

Answer 3

var deleted = xhr.responseText;
if (deleted == 'true') {
    this.setState({'array': this.state.comments.remove(2));
}

一般是这么写。重新返回一个state对象，react会自己合并 assign

Answer 4

getInitialState(){
    return {
       comments: [], 
    }
}

var deleted = xhr.responseText;
if (deleted) {
    this.setState(comments: deleted);
}

去啃文档 & 搜入门文章