react学习笔记(生命周期)

生成期:

1、constructor(  )    constructor一般做组件state初绐化工作,被调用是在组件准备要挂载的最一开始,所以此时组件尚未挂载到网页

2、componentWillMount(  )  componentWillMount方法的调用在constructor之后,在render之前,在这方法里的代码调用setState方法不会触发重渲染,所以它一般不会用来作加载数据之用

3、render(  )

4、componentDidMount(  ) componentDidMount方法中的代码是在组件已经完全挂载到网页上才会调用被执行,所以可以保证数据的加载。此外,在这方法中调用setState方法,会触发重渲染

存在期:

1 componentWillReceiveProps() componentWillReceiveProps在初始化render的时候不会执行,它会在Component接受到新的状态(Props)时被触发


nextProps代表这次的props值,this.props代表上次props的值

2 shouldComponentUpdate()  shouldComponentUpdate让React知道当前状态或属性的改变是否不影响组件的输出,默认返回ture,返回false时不会重写render,而且该方法并不会在初始化渲染或当使用forceUpdate()时被调用

shouldComponentUpdate(nextProps, nextState) {

  return nextState.someData !== this.state.someData

}

}

3 componentWillUpdate() componentWillUpdate(nextProps, nextState)与componentWillMount方法类似,组件上会接收到新的props或者state渲染之前,调用该方法。但是不可以在该方法中更新state和props

4 componentDidUpdate() componentDidUpdate(prevProps,  prevState)方法会传入两个参数:prevProps, prevState。这个正好和componentWillUpdate是相对的。这个两个参数的值就是在方法调用之前的this.props和this.state

销毁期:

1 ComponentWillUnmount() ComponentWillUnmount()在组件被卸载和销毁之前立即调用。在此方法中执行任何必要的清理,例如使计时器无效、取消网络请求或清除在组件

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 作为一个合格的开发者,不要只满足于编写了可以运行的代码。而要了解代码背后的工作原理;不要只满足于自己的程序...
    六个周阅读 12,688评论 1 33
  • 4-8、React中的生命周期函数 生命周期函数指某一个时刻组件会自动调用执行的函数 1)初始化(initiali...
    wayne1125阅读 2,047评论 0 2
  • 生命周期流程图简单如下: 组件让你把用户界面分成独立的,可重复使用的部分,并且将每个部分分开考虑。React.Co...
    Simple_Learn阅读 4,731评论 0 0
  • 要讲React的生命周期的话,网上讲的已经很过了,不过大多数是讲react单个组件的生命周期,理论上组件本...
    周宇_6b69阅读 5,420评论 0 0
  • 姓名:施杰 部门:分水碶 组别:待定 【知~学习】 活法 : 以利他心度人生 - 利润只是受委托临时保管 最终需要...
    施杰分水碶阅读 1,248评论 0 0