react 组件传参,子组件通过 this.props 接受参数,放在state中,此时父组件第二次传递参数,子组件没有更新
时间: 2023-08-18 21:44:34 浏览: 99
React 组件间的通信示例
当父组件传递参数给子组件时,如果子组件将参数存储在自己的状态中,那么父组件重新传递参数时,子组件不会自动更新状态。这是因为React在这种情况下不会自动更新子组件的状态,需要手动进行更新。可以通过在子组件中使用`componentDidUpdate`生命周期方法来监听属性的变化并更新状态。在`componentDidUpdate`方法中,使用`this.setState`方法将新的属性值更新到组件状态中。
例如,如果子组件将属性存储在`state`中的`value`属性中,可以在`componentDidUpdate`方法中添加以下代码:
```
componentDidUpdate(prevProps) {
if (prevProps.value !== this.props.value) {
this.setState({ value: this.props.value });
}
}
```
这将比较前一个属性值和当前属性值。如果它们不同,就会更新组件状态。
阅读全文