Vue的router.addRoutes不起作用

Vue的router.addRoutes()不起作用解决方案

最近在学习制作后台管理系统的时候,涉及到了权限,在通过后台获取到数据后使用router.addRoutes()时不起作用。

最终发现左侧菜单组件中的路由是根据this.$router.options.routes来渲染的,最终使用了Vuex中的数据来渲染的。

说明:options是传递给vuerouter构造函数的对象,之后没有修改(也就是vue实例化时在router.js中定义的那些路由),所以通过动态添加的路由是不会显示在options.routes中的,Vue就是这么设计的。所以需要将动态添加的路由存储在Vuex或者其他地方。

可参考此链接:https://segmentfault.com/q/1010000021000331/a-1020000021000766

在这里插入图片描述

项目说明:后台项目使用的是vue-admin-template,上面截图的文件目录路径:‘项目根目录/src/layout/components/Sidebar/index.vue’文件中

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/639993.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

UDP协议与TCP协议1.2

UDP UDP数据报UDP报头UDP载荷 UDP的报文格式: 这里的UDP长度,描述了整个UDP数据报,占多少个字节,这里整个UDP长度最多是64kb 在UDP中校验和就是使用CRC的方式来完成的 数据在网络传输中是可能会出现错误的,例如比特翻…

Spark SQL 中DataFrame DSL的使用

在上一篇文章中已经大致说明了DataFrame APi,下面我们具体介绍DataFrame DSL的使用。DataFrame DSL是一种命令式编写Spark SQL的方式,使用的是一种类sql的风格语法。 文章链接: 一、单词统计案例引入 import org.apache.spark.sql.{DataFrame, SaveMod…

Proteus仿真小技巧(隔空连线)

用了好几天Proteus了.总结一下使用的小技巧. 目录 一.隔空连线 1.打开添加网络标号 2.输入网络标号 二.常用元件 三.运行仿真 四.总结 一.隔空连线 引出一条线,并在末尾点一下. 1.打开添加网络标号 选择添加网络标号, 也可以先点击按钮,再去选择线(注意不要点端口) 2.…

【调试笔记-20240525-Windows-配置 QEMU/x86_64 运行 OpenWrt-23.05 发行版并搭建 WordPress 博客网站】

调试笔记-系列文章目录 调试笔记-20240525-Windows-配置 QEMU/x86_64 运行 OpenWrt-23.05 发行版并搭建 WordPress 博客网站 文章目录 调试笔记-系列文章目录调试笔记-20240525-Windows-配置 QEMU/x86_64 运行 OpenWrt-23.05 发行版并搭建 WordPress 博客网站 前言一、调试环境…

【EXCEL_VBA_基础知识】15 使用ADO操作外部数据

课程来源:王佩丰老师的《王佩丰学VBA视频教程》,如有侵权,请联系删除! 目录 1. 使用ADO链接外部数据源 2. 常用SQL语句(Execute(SQL语句)) 2.1 查询数据、查询某几个字段、带条件查询、合并两表数据、插…

OpenWrt 23.05 安装中文语言包 教程 软路由实测 系列三

1 web 登录 #更改阿里云下载源,可参考第一篇文章:OpenWrt U盘安装使用 详细教程 x86/64平台 软路由实测 系列一-CSDN博客

【Linux】icmp_seq=1 Destination Host Unreachable

执行ping 命令提示:From 192.168.XX.XX icmp_seq1 Destination Host Unreachable 这个错误消息通常表示以下几种情况之一: 网络连接问题:目标主机可能没有连接到网络,或者网络中的某个路由器无法将数据包转发到目标主机。 目标主…

Vue从入门到实战Day11

一、为什么要学Vue3 Vue3官网:简介 | Vue.js 1. Vue3的优势 2. Vue2选项式API vs Vue3组合式API 示例: 二、create-vue搭建Vue3项目 1. 认识create-vue create-vue是Vue官方新的脚手架工具,底层切换到了vite(下一代构建工具),为…

【OpenGL实践-09】用图元作图笔记

文章目录 一、说明二、下列程序使用库三、OpenGL图元盘点四、图元解析4.1 线段4.2 表面surface4.3 三角形表面surface 五、图元作图示例5.1 三角链和圆环GL_TRIANGLE_STRIP5.2 三角链和圆环 六、三维物体渲染6.1 直纹面6.2 旋转面 七、GLSL程序优化代码7.1 顶点着色器7.2 几何着…

AI视频教程下载:全面掌握ChatGPT和LangChain开发AI应用(附源代码)

这是一门深入的课程,涉及ChatGPT、LangChain和Python。打造专注于现实世界AI集成的AI应用,课件附有每一节涉及到的源代码。 **你将学到什么:** - 将ChatGPT集成到LangChain的生产风格应用中 - 使用LangChain组件构建复杂的文本生成管道 - …

AI助力农田作物智能化激光除草,基于轻量级YOLOv8n开发构建农田作物场景下常见20种杂草检测识别分析系统

随着科技的飞速发展,人工智能(AI)技术在各个领域的应用愈发广泛,其中农业领域也不例外。近年来,AI助力农田作物场景下智能激光除草的技术成为了农业领域的一大亮点,它代表着农业智能化、自动化的新趋势。智…

【小tips】当机器里面有多个版本的gcc时,该如何切换当前的gcc版本?

背景切换gcc版本 背景 有时候因为项目需求,可能不同的项目需要不同的gcc版本,所以机器上会安装多个版本的gcc,那我们如何切换到想要使用的版本? 切换gcc版本 比如我的机器上有两个版本的gcc: 我当前的版本是gcc-4…

node版本管理nvm详细教程

安装 nvm 之前先清理node相关的所有配置,如环境变量、.npmrc文件、node_cache、node_global 等 一、下载nvm 任选一处下载即可 官网:Releases coreybutler/nvm-windows (github.com) 码云:nvm下载仓库: nvm下载仓库 百度网盘&#xff1…

strcpy函数及其模拟实现

1. 前言 在本文中,我将带着各位读者从了解strcpy函数,到会用strcpy函数去实现我们编程时的需求,最后再来自己模拟实现一个strcpy函数。 “毕竟只有自己做的,自己才敢放心食用“😂😂😂 2. strc…

开源网页视频会议,WebRTC音视频功能比较

1. 概述 OpenAI 发布了新一代旗舰生成模型 GPT-4o,这是一款真正的多模态大模型,可以「实时对音频、视觉和文本进行推理」。 支持与 AI 实时语音对话,且响应时间达到毫秒级;交互中可识别人类情绪并以相应的情感做出回应;多语言能力的提升,WebRTC 成为大模型关键能力。 视频会议…

系统架构师-考试-基础题-错题集锦2

108.总线-全双工、半双工: 109.软件配置管理-产品配置: 产品配置:指一个产品在其生命周期各个阶段所产生的各种形式和各种版本的文档、计算机程序、部件及数据的集合。 注意:选项中的需求规格说明、设计说明等均可归属于文档。 …

远动通讯屏柜的组成及各装置的作用

远动通讯屏柜的组成及各装置的作用 远动通讯屏是基于公共电网安全而投入的远方监控遥控设备;主要由远动装置、通讯管理机、交换机、调制解调器、GPS对时装置、数字通道防雷器、模拟通道防雷器、插线板、空气开关、屏柜及附件等设备组成、标配尺寸2260*800*600&…

软考之信息系统管理知识点(3)

流水线:是指在程序执行时多条指令重叠进行操作的一种准并行处理实现技术。各种部件同时处理是针对不同指令而言的,它们可同时为多条指令的不同部分进行工作,以提高各部件的利用率和指令的平均执行速度。 编译得过程 关系数据库是表的集合 …

初步学习pygame,使用pygame搭建简单的窗口效果

在VSCode上使用pygame 第一步:创建 Python 虚拟环境 打开 VSCode 中的 Terminal(在菜单栏中选择 View > Terminal)使用 cd 命令切换到你的项目文件夹输入以下命令来创建一个新的虚拟环境: python3 -m venv env这将在你的项目…

计算机毕业设计hadoop+spark微博舆情大数据分析 微博爬虫可视化 微博数据分析 微博采集分析平台 机器学习(大屏+LSTM情感分析+爬虫)

电商数据建模 一、分析背景与目的 1.1 背景介绍 电商平台数据分析是最为典型的一个数据分析赛道,且电商数据分析有着比较成熟的数据分析模型,比如:人货场模型。此文中我将通过分析国内最大的电商平台——淘宝的用户行为,来巩固数…