vue-router 三级路由,路由跳转页面异常白屏或404,或刷新三级路由页面后一级和二级路由菜单丢失

问题描述

  • 情况1. vue-router 定义三级路由,路由跳转了,页面404或者白屏
  • 情况2. 点击菜单三级路由后,刷新页面后一级和二级路由菜单丢失
解决方案:

某些时候是因为二级和三级的路由共用router-view,可以使用router-view 和 redirect 解决问题

   const routes = {path: '/xiaojin', // 一级路由name: 'xiaojin',redirect: '/xiaojin/abc',component: Layout,meta: {title: '一级路由',},children: [{path: "/xiaojin/abc",name: "abc",redirect: "/xiaojin/abc/aa",component: { render(c) { return c("router-view"); },},meta: {title: "二级路由",},children: [{path: "/xiaojin/abc/aa",name: "aa",meta: {title: "三级菜单",},component: () => import("../views/pages/xiaojin/aa/index.vue"),},{path: "/xiaojin/abc/lalala",name: "lalala",meta: {title: "lalala",},component: () => import("../views/pages/xiaojin/lalala/index.vue"),}],},]},
  • 今天就写到这里啦~
  • 小伙伴们,( ̄ω ̄( ̄ω ̄〃 ( ̄ω ̄〃)ゝ我们明天再见啦~~
  • 大家要天天开心哦

欢迎大家指出文章需要改正之处~
学无止境,合作共赢

在这里插入图片描述

欢迎路过的小哥哥小姐姐们提出更好的意见哇~~

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Springboot集成Druid实现监控功能

Druid是阿里巴巴开发的号称为监控而生的数据库连接池,在功能、性能、扩展性方面,都超过其他数据库连接池,包括DBCP、C3P0、BoneCP、Proxool、JBoss DataSource等等等,秒杀一切。Druid可以很好的监控DB池连接和SQL的执行情况&#…

<网络安全>《47 网络攻防专业课<第十二课 - TCPIP网络协议攻击与防范之攻击手段>》

1 建立TCP连接 三次握手 2 SYN Flood泛洪攻击 服务拒绝(DOS,Denial of Service)攻击时,攻击者想法占用被攻击者的资源,例如:带宽、CPU、内存等,使得被攻击者无法响应正常用户的请求。 SYN泛洪…

mysql 自定义函数create function

方便后续查询,做以下记录; 自定义函数是一种与存储过程十分相似的过程式数据库对象, 它与存储过程一样,都是由 SQL 语句和过程式语句组成的代码片段,并且可以被应用程序和其他 SQL 语句调用。 自定义函数与存储过程之间…

【机器学习的基本术语和概念】

曾梦想执剑走天涯,我是程序猿【AK】 目录 简述概要知识图谱 简述概要 提示:简要描述文章内容,适合哪些人观看 知识图谱 样本(Sample)/实例(Instance):在机器学习中,我…

创建一个基于Node.js的实时聊天应用

在当今数字化社会,实时通讯已成为人们生活中不可或缺的一部分。无论是在社交媒体平台上与朋友交流,还是在工作场合中与同事协作,实时聊天应用都扮演着重要角色。与此同时,Node.js作为一种流行的后端技术,为开发者提供了…

【2024.02.22】定时执行专家 V7.0 发布 - TimingExecutor V7.0 Release - 龙年春节重大更新版本

目录 ▉ 新版本 V7.0 下载地址 ▉ V7.0 新功能 ▼2024-02-21 V7.0 - 更新日志▼ ▉ V7.0 新UI设计 ▉ 新版本 V7.0 下载地址 BoomWorks软件的最新版本-CSDN博客文章浏览阅读10w次,点赞9次,收藏41次。▉定时执行专家—毫秒精度、专业级的定时任务执行…

大学生课程版|统计基础与python分析|一元线性回归

目录 1.一元线性回归的数学原理 2.一元线性回归的代码实现 2.1需要安装sklearn库 2.2绘制离散点图 2.3引入Scikit-Learn库搭建模型 2.4 模型预测 2.5 模型可视化 摘要:线性回归模型是利用线性拟合的方式来探寻数据背后的规律,如下图所示&#xff…

设计模式——抽象工厂模式

定义: 抽象工厂模式(Abstract Factory Pattern)提供一个创建一系列或相互依赖对象的接口,而无须指定它们具体的类。 概述:一个工厂可以提供创建多种相关产品的接口,而无需像工厂方法一样,为每一个产品都提供一个具体…

HarmonyOS—使用预览器查看应用/服务效果

DevEco Studio为开发者提供了UI界面预览功能,可以查看应用/服务的UI界面效果,方便开发者随时调整界面UI布局。预览器支持布局代码的实时预览,只需要将开发的源代码进行保存,就可以通过预览器实时查看应用/服务运行效果&#xff0c…

Jetpack Compose 可组合项的生命周期

点击查看:可组合项的生命周期 官网 在本页中,您将了解可组合项的生命周期以及 Compose 如何确定可组合项是否需要重组。 生命周期概览 正如管理状态文档中所述,一个组合将描述应用的界面,并通过运行可组合项来生成。组合是描述…

算能RISC-V通用云开发空间编译pytorch @openKylin留档

终于可以体验下risc-v了! 操作系统是openKylin,算能的云空间 尝试编译安装pytorch 首先安装git apt install git 然后下载pytorch和算能cpu的库: git clone https://github.com/sophgo/cpuinfo.git git clone https://github.com/pytorc…

2.5网安学习第二阶段第五周回顾(个人学习记录使用)

本周重点 ①多进程和多线程 1、进程和线程 2、多线程爆破 ②Redis数据库 1、Redis的使用 2、Redis持久化 3、Redis未授权免密登录 ③嗅探和Python攻击脚本 1、嗅探(端口扫描和IP扫描) 2、SCAPY的应用 3、Python攻击脚本(SYN半连接…