应用生命周期、页面生命周期的执行顺序

//App.vue
<script>
    export default {
        onLaunch: function() {
           console.log('应用生命周期onLaunch：应用初始化完成');
        },
        onShow: function() {
            console.log('应用生命周期onShow：应用启动完成')
        },
        onHide: function() {
            console.log('应用生命周期onHide：应用进入到后台状态')
        }
    }
script>

//首页index.vue
<template>template>
<script>
    export default {
        onLoad() {
            console.log('页面生命周期onLoad：页面加载')
        },
        onShow() {
            console.log('页面生命周期onShow：页面显示')
        },
        onReady(){
            console.log('页面生命周期onReady：页面初次渲染完成')
        },
        onHide() {
            console.log('页面生命周期onHide：页面隐藏')
        },
        onUnload() {
            console.log('页面生命周期onUnload：页面卸载')
        },
        onBackPress(){
            console.log('页面生命周期onBackPress：页面返回')
        },
        onShareAppMessage() {
            console.log('页面生命周期onShareAppMessage：分享页面')
        },
        onReachBottom() {
            console.log('页面生命周期onReachBottom：上拉页面触底')
        },
        onPageScroll(){
            console.log('页面生命周期onPageScroll：页面滚动')
        },
        onPullDownRefresh() {
            console.log('页面生命周期onPullDownRefresh：下拉页面')
            uni.stopPullDownRefresh();
        },
        onNavigationBarButtonTap(){
            console.log('页面生命周期onNavigationBarButtonTap：标题栏按钮点击')
        }
    }
script>

打印结果：

应用生命周期onLaunch：应用初始化完成
应用生命周期onShow：应用启动完成
页面生命周期onLoad：页面加载
页面生命周期onShow：页面显示
页面生命周期onReady：页面初次渲染完成

切换到其它页面，再切换回首页

应用生命周期onHide：应用进入到后台状态
页面生命周期onHide：页面隐藏
应用生命周期onShow：应用启动完成
页面生命周期onShow：页面显示

总结：

应用生命周期函数要先于页面生命周期函数执行。

应用生命周期执行顺序

onLaunch > onShow > onHide，其他生命周期函数需要相应动作触发才会执行。比如 onError 函数在应用出现错误才会被触发。

页面生命周期执行顺序

onLoad > onShow > onReady > onHide，其他生命周期函数需要相应动作触发才会执行。比如 onPullDownRefresh 函数在页面下拉的时候才会被触发。