应用生命周期、页面生命周期、组件生命周期

一 应用生命周期

前台、后台定义：

二 页面生命周期

说明

1 onLoad 参数说明

//index.vue
//跳转语句，并在跳转链接上面加上要传递的数据
uni.reLaunch({
    url: 'test?name=我是首页的数据'
});

//me.vue
export default {
    //options参数就是上个页面传递过来的数据
    onLoad: function (options) {
        console.log(options.name);
    }
}

//打印出来的结果
我是首页的数据

2 onPullDownRefresh 函数 用于监听该页面用户下拉页面的动作。

//pages.json
{
    "path": "pages/index/index.vue",
    "style": {
        "enablePullDownRefresh": true
    }
}

//页面，隐藏下拉状态
export default{
    onPullDownRefresh(){
        console.log('用户下拉页面时触发')
        uni.stopPullDownRefresh()
    }
}

3 onTabItemTap 参数说明

export default {
    onTabItemTap(options) {
        console.log('被点击tabItem的序号index:' + options.index)
        console.log('被点击tabItem的页面路径pagePath:' + options.pagePath)
        console.log('被点击tabItem的按钮文字text:' + options.text)
    }
}

注意以下几点：

4 onNavigationBarButtonTap 参数说明

export default {
    onNavigationBarButtonTap(options) {
        console.log('index:' + options.index)
    }
}

5 onBackPress 参数说明

export default {
    onBackPress(options) {
        console.log('from:' + options.from)
    }
}

三 组件生命周期

四 页面生命周期和组件生命周期的执行顺序

页面生命周期函数 onLoad：页面加载
页面生命周期函数 onShow：页面显示
beforeCreate：实例初始化
created：实例创建完成
beforeMount：模板编译之前
mounted：模板编译完成
页面生命周期函数 onReady：页面初次显示