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>
相关推荐
Synmbrf13 小时前
ECharts 饼图鼠标悬浮后标签 title 消失的问题
前端·javascript
breeze jiang14 小时前
React useRef 实战:从 input 聚焦到 Web Worker 引用
前端·javascript·react.js
90后的晨仔15 小时前
uni-app 项目目录结构全解:每个文件、每个文件夹的作用与配置详解
vue.js·uni-app
爱看老照片15 小时前
关于uniapp中单位rpx的注意点
uni-app·rpx
苏灿烤鱼15 小时前
GitHub #2 拆解|把工程经验装进 Agent,为什么仍会“静默失效”?
javascript·人工智能·agent
Rysxt_16 小时前
React vs Vue.js:2025年两大主流前端框架深度对比教程
vue.js·react.js·前端框架
by__csdn16 小时前
Vue vs React vs Angular:前端框架终极对决
前端·vue.js·react.js·前端框架·vue·react·angular
反正我还没长大17 小时前
Vue3响应式原理深度解析:揭秘现代前端框架的核心引擎
vue.js·前端框架·vue·proxy模式
2501_9261028617 小时前
深入浅出Vue.js前端框架设计:核心原理与实践指南
前端·vue.js·前端框架
郑州光合科技余经理21 小时前
代驾系统架构拆解:订单链路、权限组织与私有化源码交付
开发语言·后端·算法·架构·系统架构·uni-app·php