uniapp + vue3 + Script Setup 写法变动 (持续更新)

一、uniapp 应用生命周期:

https://uniapp.dcloud.net.cn/tutorial/vue3-composition-api.html

注意: 应用生命周期仅可在App.vue中监听,在其它页面监听无效

二 、uniapp页面生命周期:

https://uniapp.dcloud.net.cn/tutorial/page.html#lifecycle

三、 引入生命周期

从 @dcloudio/uni-app 包内导入 uni-app 应用生命周期及页面的生命周期。

  • 使用组合式API
javascript 复制代码
import { defineComponent, ref } from 'vue'
import { onReady } from '@dcloudio/uni-app'
export default defineComponent({
  setup() {
    const title = ref('Hello')
    onReady(() => {
      console.log('onReady')
    })
    return {
      title
    }
  }
})
  • 使用 Script Setup
javascript 复制代码
<script setup>
import { ref } from 'vue'
import { onReady } from '@dcloudio/uni-app'
const title = ref('Hello')
onReady(() => {
  console.log('onReady')
})
</script>
相关推荐
kyriewen3 小时前
别再这样写TypeScript了——Code Review中最常见的8个反模式
前端·javascript·typescript
名字还没想好☜3 小时前
Next.js ‘use client‘ 到底加在哪:Server/Client Components 边界与常见报错
开发语言·前端·javascript·react·next.js
飘尘5 小时前
一文讲清楚前端面试会问到的所有缓存
前端·javascript·面试
ThsPool5 小时前
【ENVI二次开发学习整理 04】ENVI功能扩展与二次开发
java·前端·javascript
张元清7 小时前
React useDisclosure Hook:管理模态框和抽屉的打开关闭状态 (2026)
javascript·react.js
天天码行空7 小时前
vkeyboardhand:零依赖虚拟键盘指法组件
前端·javascript·vue.js
我要两颗404西柚8 小时前
Stage four:VUE项目上线
前端·javascript·vue.js
不如摸鱼去10 小时前
Wot UI 2.3.0 发布:二维码组件来了,Open Wot 与 wot-starter 同步更新
前端·ui·微信小程序·前端框架·uni-app
蜡台10 小时前
Flutter Container 与装饰完整讲解
android·javascript·flutter·dart
满栀58510 小时前
原生JS + ECharts 多图表可视化实战:从业务实现到工程化优化
开发语言·javascript·echarts