Lifecycle API(生命周期)
以下条目严格对应 packages/wevu/src/runtime/hooks.ts 的导出函数。所有 Hook 都要求在 setup() 同步阶段调用。
App 生命周期 Hook
onLaunch()
- 作用域:
App - 源码行为:注册到
onLaunch。
onShow()
- 作用域:
App / Page / Component - 源码行为:统一注册到
onShow(App 与页面/组件共用函数名)。
onHide()
- 作用域:
App / Page / Component - 源码行为:统一注册到
onHide。
onError()
- 作用域:
App / Component - 源码行为:注册到
onError。
onPageNotFound()
- 作用域:
App - 源码行为:注册到
onPageNotFound。
onUnhandledRejection()
- 作用域:
App - 源码行为:注册到
onUnhandledRejection。
onThemeChange()
- 作用域:
App - 源码行为:注册到
onThemeChange。
页面生命周期 Hook
onLoad()
- 作用域:
Page - 源码行为:注册到页面
onLoad。
onReady()
- 作用域:
Page / Component - 源码行为:注册到
onReady;组件通过lifetimes.ready触发。
onUnload()
- 作用域:
Page / Component - 源码行为:在页面
onUnload或组件 teardown 时统一触发。
页面事件 Hook
onPullDownRefresh()
- 作用域:
Page - 源码行为:注册到页面
onPullDownRefresh。
onReachBottom()
- 作用域:
Page - 源码行为:注册到页面
onReachBottom。
onPageScroll()
- 作用域:
Page - 源码行为:注册到页面
onPageScroll。
onRouteDone()
- 作用域:
Page / Component - 源码行为:注册到
onRouteDone;组件通过pageLifetimes.routeDone桥接触发。
onTabItemTap()
- 作用域:
Page - 源码行为:注册到页面
onTabItemTap。
onResize()
- 作用域:
Page / Component - 源码行为:注册到
onResize;组件通过pageLifetimes.resize桥接触发。
返回值型页面 Hook
onShareAppMessage()
- 作用域:
Page - 源码行为:单实例 Hook(
single: true),返回值用于分享配置。
onShareTimeline()
- 作用域:
Page - 源码行为:单实例 Hook(
single: true),返回值用于朋友圈分享配置。
onAddToFavorites()
- 作用域:
Page - 源码行为:单实例 Hook(
single: true),返回值用于收藏配置。
onSaveExitState()
- 作用域:
Page - 源码行为:单实例 Hook(
single: true),返回值用于退出状态保存。
组件扩展 Hook
onAttached()
- 作用域:
Component - 源码行为:在组件
lifetimes.attached阶段触发。
onDetached()
- 作用域:
Component - 源码行为:在组件
lifetimes.detached阶段触发。
onMoved()
- 作用域:
Component - 源码行为:注册到
lifetimes.moved。
Vue 语义对齐 Hook
onBeforeMount()
- 对齐语义:Vue
beforeMount - 源码行为:在
setup()内同步立即执行。
onMounted()
- 对齐语义:Vue
mounted - 源码行为:映射到
onReady。
onBeforeUpdate()
- 对齐语义:Vue
beforeUpdate - 源码行为:映射到内部
__wevuOnBeforeUpdate。
onUpdated()
- 对齐语义:Vue
updated - 源码行为:映射到内部
__wevuOnUpdated。
onBeforeUnmount()
- 对齐语义:Vue
beforeUnmount - 源码行为:在
setup()内同步立即执行(小程序无对应原生 before-unmount)。
onUnmounted()
- 对齐语义:Vue
unmounted - 源码行为:映射到
onUnload。
onActivated()
- 对齐语义:Vue
activated - 源码行为:映射到
onShow。
onDeactivated()
- 对齐语义:Vue
deactivated - 源码行为:映射到
onHide。
onErrorCaptured()
- 对齐语义:Vue
errorCaptured - 源码行为:映射到
onError包装调用。
onServerPrefetch()
- 对齐语义:Vue
serverPrefetch - 源码行为:保留 API 形态,仅做调用时机校验,不执行实际逻辑。
小程序原生生命周期映射(说明)
以下是桥接关系说明,不是 wevu 直接导出的 Hook API。
lifetimes.created
- 映射:组件初始化桥接(无独立
onCreated导出)。
lifetimes.attached
- 映射:组件挂载流程(可使用
onAttached;onMounted仍映射onReady)。
lifetimes.ready
- 映射:
onReady。
lifetimes.moved
- 映射:
onMoved。
lifetimes.detached
- 映射:组件 teardown(可使用
onDetached)+onUnload钩子链(含onUnmounted)。
lifetimes.error
- 映射:
onError。
pageLifetimes.show
- 映射:
onShow。
pageLifetimes.hide
- 映射:
onHide。
pageLifetimes.resize
- 映射:
onResize。
pageLifetimes.routeDone
- 映射:
onRouteDone。
示例
vue
<script setup lang="ts">
import {
onMounted,
onPageScroll,
onRouteDone,
onShareAppMessage,
onShow,
ref,
} from 'wevu'
const scrollTop = ref(0)
onShow(() => {
console.log('page show')
})
onMounted(() => {
console.log('mounted')
})
onPageScroll((e) => {
scrollTop.value = e.scrollTop
})
onRouteDone(() => {
console.log('route done')
})
onShareAppMessage(() => ({
title: 'Wevu 页面分享',
path: '/pages/index/index',
}))
</script>
<template>
<view>scrollTop: {{ scrollTop }}</view>
</template>vue
<script setup>
import {
onMounted,
onPageScroll,
onRouteDone,
onShareAppMessage,
onShow,
ref,
} from 'wevu'
const scrollTop = ref(0)
onShow(() => {
console.log('page show')
})
onMounted(() => {
console.log('mounted')
})
onPageScroll((e) => {
scrollTop.value = e.scrollTop
})
onRouteDone(() => {
console.log('route done')
})
onShareAppMessage(() => ({
title: 'Wevu 页面分享',
path: '/pages/index/index',
}))
</script>
<template>
<view>scrollTop: {{ scrollTop }}</view>
</template>