10. uniapp 生命周期学习两种页面/应用生命周期

一.应用的生命周期函数
放在App.vue主组件中:

<script>
	//	应用的生命周期函数
	export default {
		onLaunch: function() {			// 当uni-app,初始化完成时触发
			console.log('App Launch')
		},
		onShow: function() {			// 当uni-app启动,或从后台进入前台显示
			console.log('App Show')
		},
		onHide: function() {			// 当uni-app,	从前台进入后台
			console.log('App Hide')
		},
		onError:function(err){			// 报错了	报错时触发	比如说显示里面的consol	少了一个字母e就会报错打印在显示台
			console.log('出现异常了',err);
		}
	}
</script>

二.页面的生命周期

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
		onLoad(option) {
			console.log('页面加载了',option);
		},
		onShow() {
			console.log('页面显示了');
		},
		onReady() {
			console.log('页面初次渲染完成了');
		},
		onHide() {
			console.log('页面隐藏了');
		},
		onUnload() {
			console.log('页面卸载了');
		},
		methods: {

		}
	}
	// onLoad	监听页面加载,其参数为上个页面传递的数据,参数类型为Object(应用于页面传参)
	// onshow	监听页面的显示.	页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面
	// onReady	监听页面初次渲染完成
	// onHide 	监听页面隐藏
	// onunload	监听页面卸载
	// 注意:tabbar 的页面展现过程一个后就保留在内容中,再次切换tabbar页面,只会触发每个页面的onShow,不会触发onLoad
</script>

猜你喜欢

转载自blog.csdn.net/m0_49714202/article/details/115583212
今日推荐