import React from ‘react‘
//生命周期第一步：挂载一个组件首先，执行constructor来创建组件。调用render函数 获取Dom结构，渲染dom,当组件挂载成功（DOM渲染完成），会执行componentDidMount生命周期函数
//生命周期第二步 修改 props或者调用this.setState方法修改状态就会进行更新操作，或者直接调用forceUpdate时会重新调用render函数，进行更新操作； 会执行componetDidUpdata函数
//生命周期第三步 ：当我们的组件不再使用，会被从DOM中移除掉（卸载）；这个时候会回调componentWillUnmount生命周期函数；
//几个不常用的钩子函数
// getDerivedStateFromProps：state 的值在任何时候都依赖于 props时使用；该方法返回一个对象来更新state；
// getSnapshotBeforeUpdate：在React更新DOM之前回调的一个函数，可以获取DOM更新前的一些信息（比如说滚动位置）；
// shouldComponentUpdate：该生命周期函数很常用，但是我们等待讲性能优化时再来详细讲解；
class Componens extends React.Component{
// constructor(props){
// super()
// this.state={
// a:1
// }
// console.log("调用constructor方法");
// console.log(props);
// }
componentDidMount(){
console.log("组件挂载完毕");
}
edit(){
console.log("111");
this.setState({
a:2
})
}
componentDidUpdata(){
console.log("状态更新了");
}
render(){
console.log(this);
console.log(this.props);
console.log("调用render方法");
return(
<>
<p onClick={this.props.btn}>子传父级 {this.props.operator}</p>
<h1 onClick={()=>{this.edit()}}>生命周期</h1>
</>
)
}
}
export default Componens
