在 UniApp 中,生命周期函数是指在组件(如页面、视图等)创建和销毁过程中会自动触发的一些函数。UniApp 提供了多种生命周期函数,帮助开发者在适当的时机进行相关的逻辑处理。
UniApp 的生命周期函数可以分为 页面生命周期 和 组件生命周期 两类。以下是详细的介绍:
一、页面生命周期
页面生命周期指的是每个页面从加载、显示到销毁的整个过程。
-
onLoad
页面加载时触发,参数options
包含了页面的启动参数。
适用于:获取页面传递的参数,初始化页面数据等。javascript
-
onLoad(options) {console.log('页面加载', options); }
-
onShow
页面每次显示时触发。
适用于:页面显示时需要刷新数据或处理一些界面相关的逻辑。javascript
-
onShow() {console.log('页面显示'); }
-
onReady
页面首次渲染完成时触发。
适用于:页面渲染完成后的一些处理,通常用于 DOM 操作等。javascript
-
onReady() {console.log('页面渲染完成'); }
-
onHide
页面隐藏时触发(如进入后台、页面跳转)。
适用于:暂停或保存状态,避免一些不必要的操作。javascript
-
onHide() {console.log('页面隐藏'); }
-
onUnload
页面卸载时触发(如页面被销毁,用户离开页面)。
适用于:页面销毁时进行清理操作,如清除定时器、取消订阅等。javascript
-
onUnload() {console.log('页面卸载'); }
-
onPullDownRefresh
用户下拉页面时触发。
适用于:刷新页面内容。javascript
-
onPullDownRefresh() {console.log('页面下拉刷新'); }
-
onReachBottom
页面触底时触发。
适用于:加载更多数据。javascript
-
onReachBottom() {console.log('页面触底'); }
-
onPageScroll
页面滚动时触发。
适用于:监听滚动位置变化,执行页面滚动相关操作。javascript
-
onPageScroll(e) {console.log('页面滚动', e); }
-
onShareAppMessage
用户点击分享按钮时触发。
适用于:定制分享内容。javascript
-
onShareAppMessage() {return {title: '分享标题',path: '/pages/index/index',}; }
二、组件生命周期
组件生命周期是指 UniApp 中自定义组件的生命周期函数。它分为 组件创建、组件显示、组件销毁 等过程。
-
created
组件实例化时触发。
适用于:初始化组件的状态,执行数据请求等。javascript
-
created() {console.log('组件创建'); }
-
attached
组件挂载到页面时触发。
适用于:DOM 节点已渲染,适合进行操作和监听事件。javascript
-
attached() {console.log('组件挂载'); }
-
ready
组件渲染完成后触发。
适用于:执行需要访问组件节点的方法,如获取元素尺寸等。javascript
-
ready() {console.log('组件渲染完成'); }
-
moved
组件被移动到节点树中时触发。
适用于:处理组件位置变动时的逻辑。javascript
-
moved() {console.log('组件已移动'); }
-
detached
组件从页面卸载时触发。
适用于:清理定时器、事件监听器等资源。javascript
-
detached() {console.log('组件卸载'); }
三、全局生命周期
UniApp 中还可以使用一些全局生命周期函数来管理应用程序的状态:
-
onLaunch
应用启动时触发。
适用于:全局初始化操作、获取用户信息等。javascript
-
onLaunch() {console.log('应用启动'); }
-
onShow
应用每次显示时触发。
适用于:应用从后台回到前台时进行的一些逻辑处理。javascript
-
onShow() {console.log('应用显示'); }
-
onHide
应用每次隐藏时触发。
适用于:应用进入后台时,暂停相关操作等。javascript
-
onHide() {console.log('应用隐藏'); }
-
onError
全局错误捕获。
适用于:捕获并处理应用运行时的错误。javascript
-
onError(msg) {console.log('应用发生错误:', msg); }
-
onPageNotFound
页面不存在时触发。
适用于:自定义 404 页面或处理页面跳转失败等。javascript
-
onPageNotFound() {console.log('页面不存在'); }
总结
UniApp 的生命周期函数为开发者提供了丰富的钩子,可以在不同的时间点处理相应的逻辑。页面生命周期主要包括页面加载、显示、隐藏和卸载等阶段,而组件生命周期则处理组件的创建、挂载、渲染和销毁等。合理利用这些生命周期函数,可以更高效地开发 UniApp 应用,提升应用的性能和用户体验。