您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

JavaScript在ReactJS中正确修改状态数组

JavaScript在ReactJS中正确修改状态数组

该阵营的文档说:

将此this.state视为不可变的。

push将直接更改状态,即使您此后再次“重置”状态,也有可能导致易于出错的代码。F.ex,这可能会导致某些生命周期方法(如componentDidUpdate不会触发)。

在更高版本的React中,建议的方法是在修改状态以防止竞争情况时使用 updater 函数

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

与使用非标准状态修改可能会遇到的错误相比,内存“浪费”不是问题。

您可以使用concat干净的语法,因为它会返回一个新数组:

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

在ES6中,您可以使用Spread运算符:

this.setState({
  arrayvar: [...this.state.arrayvar, newelement]
})
javascript 2022/1/1 18:14:43 有653人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶