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>
相关推荐
张元清14 分钟前
Astro 6.0:被 Cloudflare 收购两个月后,这个"静态框架"要重新定义全栈了
前端·javascript·面试
青青家的小灰灰17 分钟前
深入理解 async/await:现代异步编程的终极解决方案
前端·javascript·面试
阿懂在掘金19 分钟前
早点下班(Vue2.7版):旧项目也能少写 40%+ 异步代码
前端·vue.js·开源
用户57573033462436 分钟前
JavaScript 原型继承全解析:从 call/apply 到寄生组合式继承
javascript
一只叁木Meow1 小时前
Skills:让通用 AI 秒变"领域专家"
vue.js·人工智能
李剑一1 小时前
超实用!数字孪生 Cesium 园区 3D 模型加载,一次学会的保姆级教程
前端·vue.js·cesium
wuhen_n1 小时前
动态组件与 keep-alive:如何优化页面切换体验与性能?
前端·javascript·vue.js
wuhen_n1 小时前
插槽的作用域与分发:如何让组件更灵活、可定制?
前端·javascript·vue.js
摸鱼的春哥2 小时前
你适合养龙虾🦞吗?4类人不适合2类适合
前端·javascript·后端
清汤饺子12 小时前
OpenClaw 本地部署教程 - 从 0 到 1 跑通你的第一只龙虾
前端·javascript·vibecoding