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>
相关推荐
计算机毕设VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue医院设备管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
北辰alk1 天前
Vue 路由信息获取全攻略:8 种方法深度解析
vue.js
北辰alk1 天前
Vue 三剑客:组件、插件、插槽的深度辨析
vue.js
北辰alk1 天前
Vue Watch 立即执行:5 种初始化调用方案全解析
vue.js
北辰alk1 天前
Vue 组件模板的 7 种定义方式:从基础到高级的完整指南
vue.js
北辰alk1 天前
深入理解 Vue 生命周期:created 与 mounted 的核心差异与实战指南
vue.js
计算机毕设VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue小型房屋租赁系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
北辰alk1 天前
Vuex日渐式微?状态管理的三大痛点与新时代方案
vue.js
无羡仙1 天前
Vue插槽
前端·vue.js
哈__1 天前
React Native 鸿蒙跨平台开发:PixelRatio 像素适配
javascript·react native·react.js