ReactJS中状态数组的正确用法?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (154)

想在state数组做这个,这是正确的方法吗?

this.state.arrayvar.push(newelement);
this.setState({arrayvar:this.state.arrayvar});
提问于
用户回答回答于

最简单的,如果用ES6...

initialArray = [1, 2, 3];

newArray = [ ...initialArray, 4 ]; // --> [1,2,3,4]

新数组将是[1,2,3,4]

this.setState({arrayvar:[...this.state.arrayvar, newelement]});

了解有关数组的更多信息。

用户回答回答于

一个更好的选择是:

var arrayvar = this.state.arrayvar.slice()
arrayvar.push(newelement)
this.setState({ arrayvar: arrayvar })

替代语法

可以用concat,因为它会返回一个新数组:

this.setState({ 
  arrayvar: this.state.arrayvar.concat([newelement])
})

在ES6中,可以使用扩展算子:

this.setState({
  arrayvar: [...this.state.arrayvar, newelement]
})

在以后的Reaction版本中,推荐的方法是使用更新者函数,而不是允许更实用的语法的对象:

this.setState(prevState => ({
  arrayvar: [...prevState.arrayvar, newelement]
}))

扫码关注云+社区

领取腾讯云代金券