uni生命周期

uni生命周期分为：页面生命周期和应用生命周期

应用生命周期：

onLaunch：当uni-app初始化完成时触发(全局只触发一次)

onShow：当uni-app启动，或从后台进入前台显示

onHide：当uni-app从前台进入后台

onUniNViewMessage：对nvue页面发送的数据进行监听

页面生命周期：

onLoad：监听页面加载，其参数为上个页面传递的数据，参数类型为Object

onShow：监听页面显示

onReady：监听页面初次渲染完成

onHide：监听页面隐藏

onUnload：监听页面卸载

onPullDownRefresh：监听用户下拉动作，一般用于下拉刷新

onReachBottom：页面上拉触底事件的处理函数

onShareAppMessage：用户点击右下角分享

<template>
    <view class="content">
        <image class="logo" src="../../static/image/myHover.png" @click="tap"></image>
        <view>
            <text class="title">{{title}}</text>
        </view>
    </view>
</template>

<script>

    // 跨终端解决方案:https://uniapp.dcloud.io/platform
    // 生命周期:https://uniapp.dcloud.io/frame?id=%E9%A1%B5%E9%9D%A2%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F

    export default {
        data() {
            return {
                title: 'Hello'
            }
        },
        onLoad() {
            console.log('页面加载')
        },
        onShow() {
            console.log('页面显示')
        },
        onReady(){
            console.log('页面初次显示')
        },
        onHide() {
            console.log('页面隐藏')
        },
        onUnload() {
            console.log('页面卸载')
        },
        onBackPress(){
            console.log('页面返回...')
        },
        onShareAppMessage() {
            console.log('分享!')
        },
        onReachBottom() {
            console.log('下拉加载...')
        },
        onPageScroll(){
            console.log('页面滚动...')
        },
        onPullDownRefresh() {
            console.log('上拉刷新...')
            uni.stopPullDownRefresh();
        },

        // #ifdef APP-PLUS
        onNavigationBarButtonTap(){

        },
        // #endif

        methods: {
            tap(){
                console.log('tap点击!');
            }
        }
    }
</script>

<style lang="scss">
    .content {
        text-align: center;
        height: 400upx;
    }

    .logo {
        height: 200upx;
        width: 200upx;
        margin-top: 200upx;
    }

    .title {
        font-size: 36upx;
        color: #8f8f94;
    }
</style>