gpt4 book ai didi

reactjs - React 替换 componentWillReceiveProps

转载 作者:行者123 更新时间:2023-12-03 19:42:44 27 4
gpt4 key购买 nike

在我的子组件中使用以下方法更新 Prop 更改状态,效果很好

  componentWillReceiveProps(nextProps) {
// update original states
this.setState({
fields: nextProps.fields,
containerClass: nextProps.containerClass
});
}

我收到 Warning: Using UNSAFE_componentWillReceiveProps in strict mode is not recommended and may indicate bugs in your code.
我尝试更新但直到现在都没有成功
static getDerivedStateFromProps(nextProps, prevState) {
if (nextProps.fields !== prevState.fields) {
return { fields: nextProps.fields };
}
}

componentDidUpdate(nextProps) {
console.log(nextProps);
this.setState({
fields: nextProps.fields,
containerClass: nextProps.containerClass
});
}

因为我陷入了无限循环。

如何根据新 Prop 正确更新我的状态

最佳答案

你会得到循环,因为每次组件更新时你都会设置新的状态。因此,如果状态更新,则意味着组件更新,然后您再次更新它。
因此,您需要防止在状态更改时更新组件。

componentDidUpdate(prevProps, nextProps) {
if(prevProps !== this.props){
console.log(nextProps);
this.setState({
fields: nextProps.fields,
containerClass: nextProps.containerClass
});
}
}

关于reactjs - React 替换 componentWillReceiveProps,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60919347/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com