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>
相关推荐
有梦想的攻城狮5 分钟前
从0开始学vue:pnpm怎么安装
前端·javascript·vue.js
pzpcxy5207 分钟前
安装VUE客户端@vue/cli报错警告npm WARN deprecated解决方法 无法将“vue”项识别为 cmdlet、函数
前端·vue.js·npm
疯狂的沙粒22 分钟前
uni-app 如何实现选择和上传非图像、视频文件?
前端·javascript·uni-app
^Rocky24 分钟前
uniapp 集成腾讯云 IM 富媒体消息(地理位置/文件)
uni-app·腾讯云·媒体
$程25 分钟前
Uniapp 二维码生成与解析完整教程
前端·uni-app
tryCbest31 分钟前
UniApp系列
uni-app·web
Mintopia1 小时前
光影魔术师的秘密:用 JavaScript 打造软阴影的奇幻世界
前端·javascript·计算机图形学
Mintopia1 小时前
Three.js 粒子系统:让代码化身奇幻造梦师
前端·javascript·three.js
mpr0xy2 小时前
React Router 中 navigate 后浏览器返回按钮不起作用的问题记录
javascript·react.js·浏览器·路由
itwlz2 小时前
vite配置@别名,以及如何让IDE智能提示路经
开发语言·前端·javascript