最近在看老项目的路由逻辑

项目使用constantRoutes和asyncRoutes分别代表基本路由和动态路由。createRouter时，传入的routes参数只有基本路由

在路由导航守卫中，判断用户权限生成动态路由，通过router.addRoutes方法将动态路由添加到路由中

但是我发现router.addRoutes之后，打印$router.options.routes，打印出来的并不是全量的路由，仍然只有基本路由（虽然打印不出来，但是不影响使用，页面跳转没有任何问题）

查了下项目里的路由逻辑没有问题，那原因可能就在vue-router上了

查看node_modules中vue-router源码，发现router.addRoutes方法中，只给matcher对象增加了新路由，并没有更新router.option

matcher对象是给vue-router内部使用的，所以项目里页面跳转没有出问题，但router.option打印不出来

我本地项目中vue-router是3.0.6版本

查看vue-router当前最新版本，3.5.4版本的源码，发现vue官方新增了getRoutes方法，用于获取matcher对象上的全量路由

$router.options.routes取不到全部路由的解决方法

方法一，vue-router更新到3.5.0版本以上，使用getRoutes方法获取

方法二，使用状态管理工具，自行保存一份路由数据

随机推荐

  1. java中bimface 在线申请token。模型视角 模型批注处理

    在线申请token 1.首先引入包 <dependency> <groupId>com.bimface</groupId> <artifactId>bi ...

  2. 干货分享：Air700ECQ的硬件设计，第二部分

    ​ 接下来分享第二部分. 3.10. 功能管脚 3.10.1. MAIN_RI 管脚名 类型 序号 电压域 作用 MAIN_RI DO 5 LDOAON 振铃信号,唤醒输出管脚,用于唤醒AP 表格 1 ...

  3. Python中dict支持多个key的方法

    在Python中,字典(dict)是一种非常强大的数据结构,它允许我们通过键(key)来存储和检索值(value).有时候,我们可能想要根据多个键来检索或操作字典中的数据.虽然Python的字典不直接 ...

  4. （Python基础教程之十四）Python将tuple开箱为变量或参数

    Python示例将N元素元组或序列开箱缩为N个变量的集合.将元组开箱缩为变量的 Python示例. 1. Python开箱元组示例 可以使用简单的赋值操作将任何序列(或可迭代)开箱缩为变量.唯一的要求 ...

  5. 一个新的音乐管理软件--JxAudio

    介绍 JxAudio是一个基于.net core的音频管理系统,支持音乐的播放.上传.下载.删除等功能. 兼容Subsonic协议,可以使用Subsonic客户端进行访问. 支持Windows.Lin ...

  6. Redis中常见的延迟问题

    使用复杂度高的命令 Redis提供了慢日志命令的统计功能 首先设置Redis的慢日志阈值,只有超过阈值的命令才会被记录,这里的单位是微妙,例如设置慢日志的阈值为5毫秒,同时设置只保留最近1000条慢日 ...

  7. vue3 + pnpm 打造一个 monorepo 项目

    Monorepo 和 Multirepo 单一仓库(Monorepo)架构,可以理解为:利用单一仓库来管理多个packages的一种策略或手段:与其相对的是多仓库(Multirepo)架构 Monor ...

  8. VUE3 使用资源路径加载

    1.使用场景 有些情况下,我需要使用组件路径动态的方式加载组件. 2.实现方法 import { defineAsyncComponent } from 'vue'; /** * 根据view组件路径 ...

  9. 前端17号学习（html完结）

    一.路径 1.目录文件夹和跟目录 实际工作中需要创建一个文件夹来管理他们. 目录文件夹,就是普通文件夹,里面存放页面相关素材,如html文件.图片等. 根目录,打开目录文件夹的第一层就是根目录. 2. ...

  10. CDP与Selenium相结合——玩转网页端自动化数据采集/爬取程序

    Selenium Selenium 是一款开源且可移植的自动化软件测试工具,专门用于测试网页端应用程序或者采集网页端数据.它能够在不同的浏览器和操作系统上运行,具有很强的跨平台能力.Selenium可 ...