wepy中的生命周期

wepy中的生命周期的钩子函数有：onLoad，onReady，onShow，onPrefetch等，其中onReady，onShow，onPrefetch只有wepy.page中才有用。wepy.component只支持onLoad，其他都不会触发。

<style lang="less">
 
</style>
<template>
  <view class="container">
    <view>wepy生命周期</view>
    <view>{{message1}}</view>
    <view>{{message2}}</view>
    <view>{{message3}}</view>
  </view>
</template>

<script>
  import wepy from 'wepy'
  export default class Content extends wepy.page {
    config = {
      navigationBarTitleText: '内容'
    }
    data = {
      message1:'',
      message2:'',
      message3:''
    }
    //onLoad:页面加载完成时调用，一个页面只会调用一次。（在路由跳转的时候通过navigateTo跳转的话onload会重新执行，通过navigateBack跳转的话onLoad不会重新执行）
    onLoad(){
      console.log(111)
      this.message1 = '页面第一次进来';
    }

    //onShow:页面显示的时候调用,每进来一次都会调用
    onShow(){
      console.log(222)
      this.message2 = '页面进来了';
    }

    //onReady:页面中所有资源加载完成时调用
    onReady(){
      console.log(333)
      this.message3 = '页面资源加载完成了';
    }

    //onPrefetch:页面跳转时触发，用于预加载和预查询数据
    onPrefetch(){
      console.log(444)//页面跳转进来时触发
    }

    //onUnload:页面卸载时触发（通过redirectTo，switchTab，navigateBack，reLaunch会触发当前页面中的onUnload，但navigateTo不会触发）
    onUnload(){
      console.log(555)//离开页面时触发
    }
  }
</script>

打印结果：

由此可知，wepy生命周期顺序：onPrefetch > onLoad > onShow > onReady > onUnload。