uni-app H5端 getApp().$router 为undefined

uni-app H5端 getApp().$router 为undefined

示例代码：

uni.navigateTo({ url: '/pages/user/index' });
```

## 操作步骤：

uni.navigateTo({ url: ‘/pages/user/index’ });


## 预期结果：
跳转到指定页面

## 实际结果：
控制台报错

## bug描述：
在页面A执行

uni.navigateTo({ url: ‘/pages/user/index’ });

页面无法跳转，控制台报错；进去报错位置打断点，发现getApp().$router 为undefined  

![Image](https://www.itying.com/uniimg.php?url=https://img-cdn-tc.dcloud.net.cn/uploads/questions/20240411/b5744ab504b36883c16816d9a6fcfb12.jpg)
信息类别 内容
产品分类 uniapp/H5
PC开发环境 Mac
操作系统版本 14.2.1
浏览器平台 Chrome
浏览器版本 122.0.6261.129
项目创建方式 CLI
CLI版本号 4.08（vue3）

更多关于uni-app H5端 getApp().$router 为undefined的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

能发个复现的demo吗？帮你看下

更多关于uni-app H5端 getApp().$router 为undefined的实战教程也可以访问 https://www.itying.com/category-93-b0.html


重新run了一下又可以了，谢谢

回复 d***@sonoscape.net: 还真是，第一次死活不行

我也发现了这个问题，在git切换分支时会发生，切换完分支后重新运行一下就可以了，可能是热更新的问题

在 uni-app 中，getApp().$router 是 undefined，通常是因为在 H5 端，uni-app 使用的是 vue-router 进行路由管理，而 getApp().$router 并不是 uni-app 的标准 API。

解决方案

  1. 使用 uni.navigateTo 等路由 API 你可以使用 uni-app 提供的路由 API 进行页面跳转，例如：

    uni.navigateTo({
    url: '/pages/yourPage/yourPage'
});

  2. 直接使用 this.$router（在 Vue 组件中） 在 Vue 组件中，你可以直接使用 this.$router 进行路由操作：

    this.$router.push('/pages/yourPage/yourPage');

  3. 获取 vue-router 实例 如果你确实需要获取 vue-router 实例，可以通过以下方式获取：

    import router from '@/router'; // 假设你的路由配置文件在 @/router/index.js

// 然后你可以使用 router 进行路由操作
router.push('/pages/yourPage/yourPage');
回到顶部