当我在主组件中更改我的道具时，为什么我的道具没有转到子组件？

Question

当我更改我的状态时，我可以在主组件中读取 newData 但我的更新状态不会进入我的子组件。我只读取了 ChildComponent 中的 initialData。为什么不把我的新道具放到 ChildComponent 中？或者为什么不重新渲染我的 ChildComponent ？

class Main extends Component{
 constructor(props) {
        super(props);
        this.state = {
          data: "initalData",
        }
}

componentDidMount(){
this.changeState();
}

changeState(){
this.setState({data: "newData"})
}

render(){
console.log("my data in Main :",this.state.data)
return(
<ChildComponent dataProps={this.state.data}>
)
}

class ChildComponent extends Component{
constructor(props) {
        super(props);
        const getData = props.dataProps;
        console.log("getData is ",getData)
        this.state = {
          ...,
        }
}
}

Answer 1

因为class组件的constructor在初始化的时候只运行一次，不是每次渲染都

要始终获取最新值，您需要将它们放在构造函数下方的 class 组件主体中。

像这样：

class ChildComponent extends Component{
  constructor(props) {
          super(props);
          this.state = {
            ...
          }
  }

  const getData = this.props.dataProps;
  console.log("getData is ", getData)

  render() (
    ...
  )
}

Answer 2

每次传递给它的道具发生变化时，您都可以使用下面的方法进行更新

componentDidUpdate(prevProps, prevState, snapshot){
    if(prevProps !== this.props){
    this
  }
}

ComponentDidUpdate docs

当我在主组件中更改我的道具时，为什么我的道具没有转到子组件？

Why doesn't go my props to child component when I changed my props in Main Component?

reactjs

react-props

react-component