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>
相关推荐
globaldomain12 小时前
立海世纪:WordPress 6.9的新功能、新模块、新API
前端·javascript·html·新媒体运营·网站建设·wordpress·域名注册
全栈老石12 小时前
手写一个无限画布 #2:渲染层的博弈:Canvas 还是 WebGL ?
javascript·canvas
特立独行的猫a12 小时前
uni-app x跨平台开发实战:开发鸿蒙HarmonyOS滚动卡片组件,scroll-view无法滚动踩坑全记录
华为·uni-app·harmonyos·uniapp-x
小岛前端12 小时前
从 Vite 到 Vize:Vue 开发体验的下一次飞跃
前端·vue.js
阿珊和她的猫12 小时前
实现网页锚点功能的技术指南
前端·javascript·vue.js·状态模式
花生柿子12 小时前
在elementui可横向滚动的table中,操作列有时候会透视下面的行
前端·javascript·elementui
RunsenLIu12 小时前
基于 Spring Boot 3 与 Vue 3 的汽车租赁系统
vue.js·spring boot·汽车
阿珊和她的猫12 小时前
浏览器跨页签数据共享方案
前端·javascript·vue.js·chrome
xkxnq12 小时前
第六阶段:Vue生态高级整合与优化(第82天)(Pinia高级用法)持久化方案(pinia-plugin-persistedstate)+ 安全存储策略
前端·vue.js·安全
郑州光合科技余经理12 小时前
从零到一:构建UberEats式海外版外卖系统
java·开发语言·前端·javascript·架构·uni-app·php