Javascript Can'；无法理解shouldComponentUpdate（）中的下一步操作？

在方法“shouldComponentUpdate（）”（应用程序内组件）中，按钮单击的状态被更新，所有内容都被重新呈现，更新的状态仅作为道具传递给生命周期组件。生命周期组件中的this.props.text如何引用以前状态的值

  class App extends React.Component{
  constructor(){
    super();
    this.state = {
      text : "hello_"
    }
  }


  handle = () =>{
    this.setState({text : this.state.text+'hello_'})
  }
  render(){
    return(
      <div>
        <p>
        {'App' + this.state.text}
        </p>
        <button onClick = {this.handle}> click </button>
        <Lifecycle text = {this.state.text}/>
      </div>
      )
  }
}


Lifecycle.js
  class Lifecycle extends React.Component{
  constructor(props){
    super(props);
    }

 
  shouldComponentUpdate(nextProps, nextState){
    console.log('shouldComponentUpdate', nextProps, this.props.text)
    return true
  }
  render(){
    return(
        <div>
         {this.props.text}
        </div>
      )
  }
}```

类应用程序扩展了React.Component{
构造函数（）{
超级（）；
此.state={
文字：“你好”
}
}
句柄=（）=>{
this.setState（{text:this.state.text+'hello"}）
}
render（）{
返回(

{'App'+this.state.text}

点击
)
}
}
Lifecycle.js
类生命周期扩展了React.Component{
建造师（道具）{
超级（道具）；
}
shouldComponentUpdate（下一步，下一步状态）{
log（'shouldComponentUpdate'，nextrops，this.props.text）
返回真值
}
render（）{
返回(
{this.props.text}
)
}
}```

shouldComponentUpdate

允许您自定义道具和状态的比较方式（您自己的函数或第三方库）。将比较当前道具和状态，并返回布尔值。

首先回答这些问题，哦，好的！仅更新状态后，我们将更新的状态作为道具传递给子组件，那么为什么子组件中的这个.props指的是前一个状态？我不认为它是“前一个状态”和“下一个状态”，而是“当前状态”和“下一个状态”。调用

setState

时，将生成一个新的渲染树，并与当前渲染树进行比较。当您将

组件

用作子组件时，当其父组件重新渲染时，它将始终重新渲染

ShouldComponentUpdate

允许您编写自己的逻辑“当前状态vs即将到来/下一个状态”，并基于该逻辑-子级是否应更新（重新渲染）。在组件内部，您始终可以访问当前状态和道具，而

ShouldComponentUpdate

将接收“下一个”。