要修改state中的数组,可以使用setState方法更新state的值。在React中,不应直接修改state中的值,而是应该创建一个新的数组,并将其赋给state。
示例代码如下:
class MyComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
myArray: [1, 2, 3]
};
}
handleClick() {
// 创建一个新的数组,并将其赋给state
this.setState(prevState => ({
myArray: [...prevState.myArray, 4]
}));
}
render() {
return (
<div>
<button onClick={() => this.handleClick()}>添加元素</button>
<ul>
{this.state.myArray.map(item => (
<li key={item}>{item}</li>
))}
</ul>
</div>
);
}
}
在上述示例中,通过点击按钮,会调用handleClick
方法,在该方法中创建一个新的数组,并使用扩展运算符...
将原数组中的元素展开,再加上要添加的元素,最后将新的数组赋给state中的myArray
属性。这样就实现了修改state中的数组。
辰迅云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
推荐阅读: react动态加载组件怎么实现