gpt4 book ai didi

javascript - 在一个组件的状态更改时重新渲染第二个组件

转载 作者:行者123 更新时间:2023-11-30 15:15:52 24 4
gpt4 key购买 nike

Component A
this.state = {
x: 1,
y: 2
}

reset () {
this.setState ({
x: 3,
y: 5
})
}


render () {
<B x = {this.state.x} y = {this.state.y} onClick = {this.reset.bind(this)}/>
}

============================================= =========

Component B

this.state = {
z: someMethod()
}

someMethod () {
return this.props.x + this.props.y
}

单击时,我正在调用重置方法并更新组件 A 的状态,但如何重新渲染组件 B。现在它不更新组件 B。

Tried with 

componentWillReceiveProps (nextProps) {

this.constructor(nextProps)
}

最佳答案

您还需要在 componentWillReceiveProps 函数中为第二个组件设置 setState。构造函数仅在初始渲染时调用,如果它依赖于 props,则不应仅在构造函数中分配状态

componentWillReceiveProps (nextProps) {

this.setState({z: nextProps.x + nextProps.y})
}

如果你想使用 someMethod 就这样做

someMethod(props) {
props? return props.x + props.y : return this.props.x + this.props.y
}

然后在 componentWillReceiveProps 中

 componentWillReceiveProps (nextProps) {
var z = someMethod(nextProps)
this.setState({z})
}

关于javascript - 在一个组件的状态更改时重新渲染第二个组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44470148/

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