uniapp,应用生命周期

最新推荐文章于 2025-08-14 08:45:00 发布

原创最新推荐文章于 2025-08-14 08:45:00 发布 · 862 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端

uni-app提供了onLaunch、onShow、onHide等生命周期函数，用于处理应用初始化、展示和隐藏等状态。在onLaunch中进行页面跳转可能导致与预设首页冲突，引发白屏错误，需要延迟处理。HBuilderX的不同版本对此有不同的处理方式，但1.9.9+版本已自动修复此问题。onShow表示应用启动或从后台返回，onHide则表示应用进入后台。当发生错误时，会触发onError。

uniapp,应用生命周期

uni-app 支持 onLaunch、onShow、onHide 等应用生命周期函数
onLaunch 初始化完成时触发（全局只触发一次）
在onlaunch生命周期内进行页面的跳转，需要注意：可能会和pages.json内配置的第一个页面跳转时机冲突。
造成的错误是手机端页面白屏，控制台报错：

11:47:40.766 Mon May 20 2019 11:47:45 GMT+0800 (CST) Page route 错误(system error)  
11:47:40.786 navigateTo with an already exist webviewId 1  
11:47:40.806 undefined  
11:47:41.006 Expected updated data but get first rendering data at uniapp://ready:182  
11:47:41.028 webviewScriptError  
11:47:41.046 Expected updated data but get first rendering data  
11:47:41.066 Error: Expected updated data but get first rendering data  
11:47:41.086 at F (uniapp://ready:182:679403)  
11:47:41.106 at uniapp://ready:182:681248  
11:47:41.126 at Array.forEach (native)  
11:47:41.155 at uniapp://ready:182:681228  
11:47:41.187 at window.dispatchGenerateFunc (file:///storage/emulated/0/Android/data/io.dcloud.HBuilder/apps/HBuilder/www/__uniappview.html:40:30)

此时需要延迟做跳转处理。
由于性能优化，HBuilderX 1.9.8和HBuilderX1.9.4的执行时机有所不同。一些在HBuilderX 1.9.4下无需延时的代码，在升级到HBuilderX 1.9.8报错。先请延迟处理。
在HBuilderX 1.9.9+版本，已在底层修复此问题，自动兼容冲突，无需开发者再写延时代码。
如果使用新版的开发者有类似问题，已经不是这个问题了

onShow uni-app 启动，或从后台进入前台显示
onHide uni-app 从前台进入后台
onError 报错时触发

<script>
	// 只能在App.vue里监听应用的生命周期
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>