vue生命周期函数、react生命周期函数、微信小程序生命周期函数、uni-app生命周期函数，简介及图示

vue生命周期函数

1. beforeCreate (创建前)
2. created （创建后）
3. beforeMount (挂载前)
4. mounted (挂载后)
5. beforeUpdate (数据更新前)
6. updated (数据更新后)
7. beforeDestroy (销毁前)
8. destroyed (销毁后)

详情传送门

react生命周期函数

初始化

1.getDefaultProps()

• getDefaultProps这种定义方式是用在你定义组件用的是React.createClass方式的
  如果使用的是es6的语法，例如用的是class 组件名 extends React.Component的话，就不要用
  getDefaultProps这种方式去定义props了，而是应该用 static propTypes ＝｛｝来定义，这样就不会有警了

getInitialState()

• 与getDefaultProps的区别在于前者设置默认的 props，后者设置初始的state在使用es6的class语法时是没有这个钩子函数的，可以直接在constructor中定义 this.state。此时可以访问this.props

componentWillMount()

• 组件初始化时只调用，以后组件更新不调用，整个生命周期只调用一次，此时可以修改state。

render()

• react最重要的步骤，创建虚拟dom，进行diff算法，更新dom树都在此进行。此时就不能更改state了。

componentDidMount()

• 组件渲染之后调用，只调用一次。可以在此请求数据

更新

componentWillReceiveProps(nextProps)

• 组件初始化时不调用，组件接受新的props时调用。

shouldComponentUpdate(nextProps, nextState)

• react性能优化非常重要的一环。组件接受新的state或者props时调用，我们可以设置在此对比前后两个props和state是否相同，如果相同则返回false阻止更新，因为相同的属性状态一定会生成相同的dom树，这样就不需要创造新的dom树和旧的dom树进行diff算法对比，节省大量性能，尤其是在dom结构复杂的时候

componentWillUpdata(nextProps, nextState)

• 组件初始化时不调用，只有在组件将要更新时才调用，此时可以修改state

render()

• 组件渲染

componentDidUpdate()

• 组件初始化时不调用，组件更新完成后调用，此时可以获取dom节点。

卸载

componentWillUnmount()

• 组件将要卸载时调用，一些事件监听和定时器需要在此时清除。

详情传送门

微信小程序生命周期函数

页面生命周期

详情传送门

1. onLoad (监听页面加载)
2. onReady (监听页面初次渲染完成)
3. onShow (监听页面显示)
4. onhide (监听页面隐藏)
5. onUnload (监听页面卸载)
6. onPullDownRefresh (监听用户下拉动作)
7. onReachBottom (页面上拉触底事件的处理函数)
8. onShareAppMessage (用户点击右上角分享)
9. onPageScroll (页面滚动触发事件的处理函数)
10. onResize (页面尺寸改变时触发，详见 响应显示区域变化)
11. onTabItemTap (当前是 tab 页时，点击 tab 时触发)

应用生命周期函数

应用生命周期函数传送门

1. onLaunch (监听小程序初始化)
2. onShow (监听小程序显示)
3. onHide (监听小程序隐藏)
4. onError (错误监听函数)
5. onPageNotFound (页面不存在监听函数)
6. onUnhandledRejection ()

组件生命周期函数

组件生命周期函数传送门

1. created (在组件实例刚刚被创建时执行)
2. attached (在组件实例进入页面节点树时执行)
3. ready (在组件在视图层布局完成后执行)
4. moved (在组件实例被移动到节点树另一个位置时执行)
5. detached (在组件实例被从页面节点树移除时执行)
6. error (每当组件方法抛出错误时执行)

组件所在页面的生命周期

1. show (组件所在的页面被展示时执行)
2. hide (组件所在的页面被隐藏时执行)
3. resize (组件所在的页面尺寸变化时执行)

uni-app 生命周期函数

应用生命周期

1. onLaunch (当uni-app 初始化完成时触发（全局只触发一次）)
2. onShow (当 uni-app 启动，或从后台进入前台显示)
3. onHide (当 uni-app 从前台进入后台)
4. onError (报错是触发)
5. onUniNViewMessage (对 nvue 页面发送的数据进行监听)
6. onUnhandledRejection (对未处理的 Promise 拒绝事件监听函数（2.8.1+）)
7. onPageNotFound (页面不存在监听函数)
8. onThemeChange (监听系统主题变化)

页面生命周期

函数名	说明
onLoad	监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参）
onShow	监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面
onReady	监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发
onHide	监听页面隐藏
onUnload	监听页面卸载
onResize	监听窗口尺寸变化
onPullDownRefresh	监听用户下拉动作，一般用于下拉刷新
onReachBottom	页面上拉触底事件的处理函数
onTabItemTap	点击 tab 时触发，参数为Object
onShareAppMessage	用户点击右上角分享
onPageScroll	监听页面滚动，参数为Object
onNavigationBarButtonTap	监听原生标题栏按钮点击事件，参数为Object
onBackPress	监听页面返回，返回 event = {from:backbutton、 navigateBack} ，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack
onNavigationBarSearchInputChanged	监听原生标题栏搜索输入框输入内容变化事件
onNavigationBarSearchInputConfirmed	监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。
onNavigationBarSearchInputClicked	监听原生标题栏搜索输入框点击事件
onShareTimeline	监听用户点击右上角转发到朋友圈
onAddToFavorites	监听用户点击右上角收藏

详情传送门