uni-app app端App.vue应用级生命周期函数onLaunch和onShow不执行

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app app端App.vue应用级生命周期函数onLaunch和onShow不执行

操作步骤：

基于Hello uniapp模版创建的项目，在App.vue页面添加

onLaunch (options)  {
console.log('App onLaunch', options)
}

和

onShow () {
console.log('App Show')
}

预期结果：

控制台打印

App onLaunch
App Show

实际结果：

没有打印

bug描述：

我在App.vue页面添加了应用级生命周期函数onLaunch，onShow都没有执行，但是mounted函数执行了，不知道怎么回事？

Image 1 Image 2 Image 3


Harmonyos Next教程
6 回复

我找到原因了，我的 main.js 文件是：
import { createApp } from ‘vue’ import App from ‘./App.vue’ import store from ‘./stores’
const app = createApp(App) app.use(store).mount(’#app’)
而官方给的列子是： import App from ‘./App’ import store from ‘./stores’ import { createSSRApp } from ‘vue’
export function createApp() { const app = createSSRApp(App) app.use(store) return { app } }
因为我并没有用到SSR，所以我改为单页应用的写法，就不执行onLaunch和onShow函数了，改回去就可以了。



好的

我新建空项目测试是正常的 可以提供一个复现demo吗？

如我评论区所说，我并没有用到SSR，所以我用createApp创建App，而不是createSSRApp，就不执行onLaunch和onShow函数了，是什么原因呢？

回复 yette123: 我看了下uniapp的vue3项目 main.js用的都是createSSRApp 没有发现有用createApp的方式 但是vue3项目中的main.js中用的都是createApp 你这个main.js不会是vue3项目复制的吧？ createApp应该是有兼容问题吧 那就用官方的呗 我uniapp的v3项目都是createSSRApp

在uni-app中，App.vue文件是用来定义整个应用的生命周期函数、全局样式和全局变量的地方。如果你发现onLaunch和onShow这两个应用级生命周期函数没有执行，这通常是由于某些配置错误或者代码逻辑问题导致的。以下是一些可能导致这个问题的原因以及相应的代码示例，帮助你排查和解决这一问题。

1. 检查App.vue文件的基本结构

首先，确保你的App.vue文件的基本结构是正确的。以下是一个标准的App.vue结构：

<template>
  <App />
</template>

<script>
export default {
  onLaunch() {
    console.log('App Launch');
    // 你的启动逻辑
  },
  onShow() {
    console.log('App Show');
    // 你的显示逻辑
  },
  onHide() {
    console.log('App Hide');
    // 可选：应用隐藏时的逻辑
  }
}
</script>

<style>
/* 全局样式 */
</style>

2. 检查是否有条件渲染或重定向

如果你的App.vue中有条件渲染或者重定向逻辑，可能会影响到生命周期函数的执行。例如，如果你使用了v-if来控制<App />的渲染，确保条件始终为真。

3. 检查manifest.json配置

有时候，manifest.json中的一些配置也可能影响到应用的启动。特别是app-plus节点下的配置，比如launchPath（指定应用启动时打开的页面路径），确保它没有错误地指向了一个不存在的页面。

4. 清理和重建项目

有时候，简单的清理和重建项目可以解决一些看似莫名其妙的问题。你可以尝试删除项目的dist目录（或类似的输出目录），然后重新运行构建命令。

5. 控制台输出和调试

在onLaunch和onShow函数中添加更多的console.log语句，以确认这些函数是否真的没有被调用。同时，你也可以使用uni-app提供的开发者工具进行断点调试。

6. 检查依赖和插件

确保你的项目依赖和插件都是最新的，有时候第三方库的bug也可能导致类似问题。

如果以上步骤都无法解决问题，建议查看uni-app的官方文档或社区论坛，看看是否有其他开发者遇到并解决了类似的问题。

回到顶部