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://xiahunao.cn/news/2804372.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

基于springboot+vue的大创管理系统(前后端分离)

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

【Android 性能优化:内存篇】——ExoPlayer 释放后内存没有恢复问题探索

背景 最近笔者承接项目的内存优化指标,在内存调研的过程中发现项目中视频播放结束后,内存没有恢复到播放前到水平。项目中用的 EXO 版本为2.19.1,并且笔者自己也写了个简单的 Demo,发现也是如此。虽然有一些偏门方法可以优化&…

阶段四python编程第四章循环

一级目录循环的基本使用 循环的作用:让指定的代码重复执行 while循环最常用的应用场景就是让执行的代码按照指定的次数重复执行 while基本语法: 如果要输出的是100个hello world,该怎么做? 死循环: 程序应该避免出现死循环 whi…

nginx 具体介绍

一,nginx 介绍 (一)nginx 与apache 1, Apache event 模型 相对于 prefork 模式 可以同时处理更多的请求 相对于 worker 模式 解决了keepalive场景下,长期被占用的线程的资源浪费问题 因为有监听线程&#…

stm32——hal库学习笔记(IIC)

一、IIC总线协议介绍(掌握) 二、AT24C02介绍(了解) 三、AT24C02读写时序(掌握) 四、AT24C02驱动步骤(掌握) 五、编程实战(掌握) myiic.c #include "./B…

C++ 基础算法 双指针 数组元素的目标和

给定两个升序排序的有序数组 A 和 B ,以及一个目标值 x 。 数组下标从 0 开始。 请你求出满足 A[i]B[j]x 的数对 (i,j) 。 数据保证有唯一解。 输入格式 第一行包含三个整数 n,m,x ,分别表示 A 的长度,B 的长度以及目标值 x 。 第二行包…

在UE5中制作UI环形进度条

在日常开发中,经常会有环形进度条UI的效果,例如技能CD时间、加载动画等,本文将通过材质球节点实现该效果,相较于准备美术素材,这样的做法更为方便,效果如下: 1.制作环状效果材质函数 在内容面…

Vue3 + Ts (使用lodash)

安装 npm i --save lodash使用 import _ from lodash⚠️报警告:!!! 此时还需要安装ts声明文件库 npm install types/lodash -D安装之后重启Vscode还是会提示上面的警告,此时还需在tsconfig.ts里面配置 {"c…

Leetcode 209.长度最小的子数组

给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其总和大于等于 target 的长度最小的 连续子数组 [numsl, numsl1, ..., numsr-1, numsr] ,并返回其长度。如果不存在符合条件的子数组,返回 0 。 示例 1: 输入&…

城市白模:裸眼3D下的未来都市构想

随着科技的飞速发展,城市规划与建设已经迈入了一个全新的时代。在这个时代里,“城市白模”成为了设计师、建筑师、城市规划者乃至普通市民的热门话题。那么,什么是“城市白模”?它又如何改变我们对城市的认知与期待呢?…

后端程序员入门react笔记(四)-综合运用,写一个小demo

样式模块化 有时候我们会遇到这样的问题,有两个css对一个class声明了样式,这样的话后引入的css会覆盖前面的css样式,导致样式冲突,那么我们怎么解决这种问题呢,我们可以使用样式的模块化,我们起名一个inde…

百度百科词条在网络推广中的六大作用

也许很多网友都发现了,在网上查资料,百科词条往往是优先展示的。一方面因为百科是搜索引擎自身的平台,另一方面就是因为百科信息权威,网友认可度高。所以企业开展网络营销,百科营销是一块重要阵地。 也有的企业认为百科…

笔试题讲解(C语言进阶)

目录 前言 1、题目 2、答案 3、解析 结语 前言 “纸上得来终觉浅&#xff0c;绝知此事要躬行”。本篇通过对指针实际案例的分析&#xff0c;由浅入深&#xff0c;来加强我们对指针的理解。 1、题目 这是一道难题&#xff0c;小心哦。 #include <stdio.h> int main(…

数字化转型导师坚鹏:政府数字化转型社会管理类案例研究

政府数字化转型社会管理类案例研究 课程背景&#xff1a; 很多地方政府存在以下问题&#xff1a; 不清楚直辖市政府数字化转型的社会管理类成功案例 不清楚地级市政府数字化转型的社会管理类成功案例 不清楚县区级政府数字化转型的社会管理类成功案例 课程特色&#x…

【LeetCode每日一题】 单调栈的案例84 柱状图中最大的矩形

84 柱状图中最大的矩形 给定 n 个非负整数&#xff0c;用来表示柱状图中各个柱子的高度。每个柱子彼此相邻&#xff0c;且宽度为 1 。 求在该柱状图中&#xff0c;能够勾勒出来的矩形的最大面积。 示例 1: 输入&#xff1a;heights [2,1,5,6,2,3] 输出&#xff1a;10 解释…

实验室预约|实验室预约小程序|基于微信小程序的实验室预约管理系统设计与实现(源码+数据库+文档)

实验室预约小程序目录 目录 基于微信小程序的实验室预约管理系统设计与实现 一、前言 二、系统功能设计 三、系统实现 1、微信小程序前台 2、管理员后台 &#xff08;1&#xff09;管理员登录 &#xff08;2&#xff09;实验室管理 &#xff08;3&#xff09;公告信息…

(全注解开发)学习Spring-MVC的第三天

全注解开发 第一部分 : 1.1 消除spring-mvc.xml 这些是原来spring-mvc.xml配置文件的内容 <!--1、组件扫描, 使Controller可以被扫描到--><context:component-scan base-package"com.itheima.controller"/><!--2、非自定义的Bean, 文件上传解析器--&…

【simulink】将STL文件导入simulink无法创造新的frame,导致无法装配

将SolidWorks零件格式改成step格式&#xff0c;即可。因为STL模型无法选中线和面&#xff0c;因此无法按自己的需求创造新的frame坐标&#xff0c;进行装配 并且得在这里重命名&#xff0c;把STEP改成stp 推荐使用相对路径&#xff0c;绝对路径的话&#xff0c;发给别人要重新…

2024 2.17~2.23 周报

一、本周计划 学习如何缝合模块&#xff0c;跑代码InversionNet、想idea并实验&#xff0c;准备开题报告&#xff0c;学习python基础语法 二、完成情况 1 学习如何在代码中加入模块 可添加的模块如&#xff1a; 通道注意力CA 空间注意力SA self attention变体 频域快速傅里…

第九节HarmonyOS 常用基础组件25-QRCode

1、描述 用于显示单个二维码的组件。 2、接口 QRCode(value:string) 3、参数 参数名 参数类型 必填 描述 value string 是 二维码内容字符串。 4、属性 名称 参数类型 描述 color ResourceColor 设置二维码颜色。默认值&#xff1a;Color.Black backgroundCo…