uniApp生命周期
当使用UniApp开发框架时,你可以利用一些生命周期钩子函数来控制页面和组件的初始化、加载和销毁过程。以下是UniApp中的所有生命周期钩子函数以及使用方法和注释解析:
一、应用生命周期钩子
1 onLaunch(options):应用初始化时触发,全局只触发一次。 2 App({ 3 onLaunch: function(options) { 4 // 应用初始化时执行的代码 5 } 6 }) 7 onShow(options):应用启动或从后台进入前台时触发。 8 App({ 9 onShow: function(options) { 10 // 应用从后台进入前台时执行的代码 11 } 12 }) 13 onHide():应用从前台进入后台时触发。 14 App({ 15 onHide: function() { 16 // 应用从前台进入后台时执行的代码 17 } 18 })
二、页面生命周期钩子
1 onLoad(options):页面加载时触发,可以获取页面参数。 2 export default { 3 onLoad(options) { 4 // 页面加载时执行的代码,可以使用options参数获取页面参数 5 } 6 } 7 onShow():页面显示时触发。 8 export default { 9 onShow() { 10 // 页面显示时执行的代码 11 } 12 } 13 onReady():页面初次渲染完成时触发。 14 export default { 15 onReady() { 16 // 页面初次渲染完成时执行的代码 17 } 18 } 19 onHide():页面隐藏时触发。 20 export default { 21 onHide() { 22 // 页面隐藏时执行的代码 23 } 24 } 25 onUnload():页面卸载时触发。 26 export default { 27 onUnload() { 28 // 页面卸载时执行的代码 29 } 30 }
三、组件生命周期钩子
1 beforeCreate():组件实例刚刚被创建,属性计算和方法定义之前触发。 2 export default { 3 beforeCreate() { 4 // 组件实例被创建时执行的代码 5 } 6 } 7 created():组件实例已经创建完成,属性已经绑定,但尚未替换真实的DOM之前触发。 8 export default { 9 created() { 10 // 组件实例创建完成时执行的代码 11 } 12 } 13 beforeMount():组件挂载开始之前执行。 14 export default { 15 beforeMount() { 16 // 组件挂载开始之前执行的代码 17 } 18 } 19 mounted():组件挂载到页面之后执行。 20 export default { 21 mounted() { 22 // 组件挂载到页面之后执行的代码 23 } 24 } 25 beforeUpdate():组件更新开始之前执行。 26 export default { 27 beforeUpdate() { 28 // 组件更新开始之前执行的代码 29 } 30 } 31 updated():组件更新完成之后执行。 32 export default { 33 updated() { 34 // 组件更新完成之后执行的代码 35 } 36 } 37 beforeDestroy():组件销毁前执行。 38 export default { 39 beforeDestroy() { 40 // 组件销毁前执行的代码 41 } 42 } 43 destroyed():组件销毁后执行。 44 export default { 45 destroyed() { 46 // 组件销毁后执行的代码 47 } 48 }