uni-app vue3组合式api使用getApp无法获调用App.vue的方法

uni-app vue3组合式api使用getApp无法获调用App.vue的方法

信息类别 详细信息
产品分类 uniapp/H5
PC开发环境 Windows
操作系统版本 11
浏览器 Chrome
浏览器版本 137
项目创建方式 CLI
CLI版本号 3.0.0-4040520250104002

操作步骤：

<script setup lang="ts">  
const init = () =>{
   console.log('ok')  
}
</script>

页面中

onLoad(() =>{
  getApp().init()
})

报错找不到.init，换其他函数名也一样

预期结果：

1

实际结果：

找不到init

bug描述：

<script setup lang="ts">  
const init = () =>{
   console.log('ok')  
}
</script>

页面中

onLoad(() =>{
  getApp().init()
})

报错找不到.init，换其他函数名也一样


更多关于uni-app vue3组合式api使用getApp无法获调用App.vue的方法的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

const app = getApp(); app.init = init;
Vue 2会吧方法和属性会自动挂载到 this.$root 上 所以其他页面可直接访问根实例的方法。 Vue 3的实例默认不会挂载 所以需要手动将方法挂载到实例上才能在其他地方使用。

更多关于uni-app vue3组合式api使用getApp无法获调用App.vue的方法的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在uni-app中使用Vue3组合式API时，<script setup>中定义的变量和方法默认是组件私有的，不会自动挂载到App实例上。要解决这个问题，可以通过以下两种方式：

  1. 使用export显式暴露方法：
<script setup lang="ts">
const init = () => {
  console.log('ok')
}
// 通过defineExpose暴露方法
defineExpose({
  init
})
</script>
  1. 使用传统Options API方式在App.vue中定义全局方法：
<script lang="ts">
export default {
  methods: {
    init() {
      console.log('ok')
    }
  }
}
</script>
回到顶部