微信小程序生命周期函数

红太狼 2021-07-25 01:43 522阅读 0赞

小程序实例生命周期
    	App({
    	  onLaunch (options) {
    	    小程序初始化完成时触发,全局只触发一次,参数也可以使用wx.getLaunchOptionsSync获取。
    	    options中包含小程序的信息
    	  },
    	  onShow (options) {
    	 	小程序启动,或从后台进入前台显示时触发,也可以使用wx.onAppShow绑定监听。
    	 	options中包含小程序的信息
    	  },
    	  onHide () {
    	    小程序从前台进入后台时触发,也可以使用wx.onAppHide绑定监听。
    
    	  },
    	  onError (msg) {
    	    小程序发生脚本错误或API调用报错时触发,也可以使用wx.onError绑定监听。
    	  },
    	  onPageNotFound(options){
    	  	小程序要打开的页面不存在时触发,也可以使用wx.onPageNotFound绑定监听。
    	  	options:
    	  	 	path:不存在页面的路径 (代码包路径)
    			query:打开不存在页面的 query 参数
    			isEntryPage:是否本次启动的首个页面(例如从分享等入口进来,首个页面是开发者配置的分享页面)
    	  },
    	  onUnhandledRejection(options){
    	  	小程序有未处理的Promise拒绝时触发,也可以使用wx.onUnhandledRejection绑定监听。
    	  	options:
    	  		reason:拒绝原因,一般是一个Error对象
    			promise:被拒绝的Promise对象
    
    	  },
    	  onThemeChange(options){
    	  	系统切换主题时触发,也可以使用wx.onThemeChange绑定监听(只有在全局配置"darkmode":true时才会触发此事件)。
    	  	options:
    	  		theme:系统当前的主题,取值为light或dark
    	  }
    	  globalData: 'I am global data'
    	})
    
    页面生命周期
    	Page({
    		onLoad(option)
    			页面加载时触发。一个页面只会调用一次，可以在 onLoad 的参数中获取打开当前页面路径中的参数。
    			参数是:Object对象,打开当前页面路径中的参数
    			
    		onShow()
    			页面显示/切入前台时触发。
    		
    		onReady()
    		
    			页面初次渲染完成时触发。一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。
    			注意：对界面内容进行设置的 API 如wx.setNavigationBarTitle，请在onReady之后进行。详见生命周期
    		
    		onHide()
    			页面隐藏/切入后台时触发。 如 wx.navigateTo 或底部 tab 切换到其他页面，小程序切入后台等。
    		
    		onUnload()
    			页面卸载时触发。如wx.redirectTo或wx.navigateBack到其他页面时。
    	})
    	
    组件生命周期
    	Component({
    		lifetimes:{ 当声明周期不在lifetimes中声明时,为是旧式的定义方式,可以保持对<2.2.3版本基础库的兼容
    			created:在组件实例刚刚被创建时执行 	
    			attached:在组件实例进入页面节点树时执行 	
    			ready:在组件在视图层布局完成后执行 	
    			moved:在组件实例被移动到节点树另一个位置时执行 	
    			detached:在组件实例被从页面节点树移除时执行 	
    			error(err):每当组件方法抛出错误时执行 	
    		},
    		pageLifetimes: {组件所在页面的生命周期,与组件本身没什么关系,但有时组件需要获知,以便组件内部处理
    			show:组件所在的页面被展示时执行 	
    			hide:组件所在的页面被隐藏时执行 	
    			resize(size):组件所在的页面尺寸变化时执行 	
    		}
    
    	})

代码示例:  
在js文件中，page(\{\})内:

在js文件中，page({ })内
      onLoad: function(options) { 
        // 页面创建时执行
      },
      onShow: function() { 
        // 页面出现在前台时执行
      },
      onReady: function() { 
        // 页面首次渲染完毕时执行
      },
      onHide: function() { 
        // 页面从前台变为后台时执行
      },
      onUnload: function() { 
        // 页面销毁时执行
      }