【Vue】vue-router使用addRoute动态加载路由后刷新页面404
场景：动态加载路由，点击菜单路由跳转正常，但刷新页面报404
原因：使用404做异常路由捕获
刷新页面会导致路由丢失，重建路由时先加载了静态路由（包含异常路由捕获404），此时动态路由还未加载完成，url没有匹配到指定路由被划到404了
解决方法：抽离出404路由，按需添加
1、在router的onReady方法中判断用户登录状态，用户未登录则添加404路由，确保未登录时访问异常地址能跳转到404
2、在router的beforeEach方法中判断用户是否登录，登录成功获取用户信息后添加404路由，避免重复添加404
// 抽离出404路由
export const errorRoutes = [{name: 'NotFound',path: '/:pathMatch(.*)*',component: ''}
]router.onReady(() => {if (!isLogin()){// 未登录添加404路由router.addRoutes(errorRoutes);}
})router.beforeEach((to, from, next) => {if (isLogin()) {if (store.state.user.menus.length === 0) {store.dispatch('user/fetchUserInfo').then((routes) => {// 登录后添加404路由router.addRoutes(routes);router.addRoutes(errorRoutes);})} }
})相关文章：
【Vue】vue-router使用addRoute动态加载路由后刷新页面404
场景：动态加载路由，点击菜单路由跳转正常，但刷新页面报404 原因：使用404做异常路由捕获 刷新页面会导致路由丢失，重建路由时先加载了静态路由（包含异常路由捕获404），此时动态路由还未…...
《计算机组成及汇编语言原理》阅读笔记：p177-p177
《计算机组成及汇编语言原理》学习第 13 天，p177-p177 总结，总计 1 页。 一、技术总结 1.real mode A programming model where the program has access to the entire capability of the machine, bypassing security and memory management. Useful…...
《从入门到精通：蓝桥杯编程大赛知识点全攻略》（一）-递归实现指数型枚举、递归实现排列型枚举
本篇博客将聚焦于通过递归来实现两种经典的枚举方法：指数型枚举和排列型枚举。这两种枚举方式在计算机科学和算法竞赛中都有广泛应用，无论是在解题中，还是在实际工作中都极具价值。 目录 前言 斐波那契数列递归 递归实现指数型枚举 算法思…...
游泳溺水识别数据集，对25729张图片进行YOLO，COCO JSON, VOC XML 格式的标注，溺水平均识别率在89.9％
游泳溺水识别数据集，对25729张图片进行YOLO，COCO JSON, VOC XML 格式的标注，溺水识别率在92％ 训练结果 数据集和标签 验证 游泳测试视频 根据测试的视频来获取检测结果： 游泳测试视频的置信度设置60% 检测结果如下&…...
coredns报错plugin/forward: no nameservers found
coredns报错plugin/forward: no nameservers found并且pod无法启动 出现该报错原因 是coredns获取不到宿主机配置的dns地址 查看宿主机是否有dns地址 resolvectl status 我这里是配置正确后，如果没配置过以下是不会显示出dns地址的 给宿主机增加静态dns地址之后将…...
【欢迎讨论方案一的可行性】SpringBoot集成netty，在handler中调用@Component注解的类
在Netty中处理请求时，调用一个由Spring Boot管理的Component注解的类 在Netty中处理请求时，调用一个由Spring Boot管理的Component注解的类，需要确保Spring上下文能够正确地注入这些组件。 方法一：使用Autowired注入Spring组件 …...
如何在LaTeX文档中为脚注添加横线，并调整横线的长度和厚度。
当然，以下是一个简单的例子，展示了如何在LaTeX文档中使用scrextend宏包来为脚注添加横线，并调整横线的长度和厚度。 ### 步骤1：导入scrextend宏包 在你的LaTeX文档的导言区（\begin{document}之前的部分）&…...
：整数的大小)
【C语言】可移植性陷阱与缺陷(三)：整数的大小
目录 一、概述 二、整数类型的大小差异 三、 跨平台代码中的整数大小问题 3.1. 内存使用 3.2. 性能问题 3.3. 数据截断 3.4. 序列化/反序列化 四、解决整数大小问题的策略 4.1. 使用固定大小的整数类型 4.2. 条件编译 4.3. 避免假设 4.4. 文档化 五、总结 在C语言编…...
nginx基础篇 - 控制命令详解：启动/停止、配置文件检查/重新加载、nginx平滑升级
文章目录 1. nginx命令2 使用Unix工具发送信号3 常用操作3.1 检查配置文件3.2 启动nginx3.3 停止nginx3.4 重启nginx 4 平滑升级nginx 1. nginx命令 执行nginx -h命令可以看到所有的nginx命令及其解释： nginx命令使用方法: nginx [-?hvVtTq] [-s signal] [-p p…...
汽车驾校转型做无人机执照培训详解， “驾” 起无人机培训新未来？
汽车驾校转型做无人机执照培训，这一趋势确实在一定程度上预示着无人机培训领域的新未来。以下是对这一转型的详细分析： 一、转型背景 1. 无人机行业快速发展： 无人机技术在农业、影视、安防、物流等多个领域的应用不断拓展，市场…...
如何科学评估与选择新版本 Python 编程语言和工具
文章目录 摘要引言评估新版本的关键因素适用性评估成本与收益分析 新版本功能的实际应用示例代码模块详细解析示例代码模块代码模块解析实际应用场景如何运行与配图 QA环节总结参考资料 摘要 随着技术的快速发展，编程语言和软件工具不断推出新版本，带来…...
TS中的enum变量和普通object区别
文章目录 一、定义二、编译后的输出三、类型安全四、使用场景五、混合使用 这两种数据经常混用，但是也有一定区别，特殊情况下混用会报错 一、定义 enum变量通常用使用常量object则没有限制值的类型 // 案例 enum Direction {Up,Down,Left,Right } const …...
SOT23-6封装小功率H桥常用直流电机、磁保持继电器驱动芯片大全
H桥常用直流电机、磁保持继电器驱动芯片大全 前言替换规则 引脚定义1：GR6205 | 2～5.5V | 200mAFM116C | 2.5V~5V | 500mATMI8118 | 1.6V～7.2V | 1.35AMX116L | 2～7V | 500mAMX116H | 2～8V | 800/1000 mAHT7K1201 | 1.8…...
Spring中的反射
反射是框架设计的灵魂，它可以使框架更加灵活和可扩展。框架是一种半成品软件，可以在其基础上进行软件开发，极大地简化了编码过程。而反射机制则是将类的各个组成部分封装为其他对象，对类进行解剖。通过反射，我们可以在…...
5.12--DenseNet
1.网络结构介绍 DenseNet最大的特点是对相同大小的特征图来说，每一层都与前馈层和后序层相连，以及两层之间是拼接起来的而不是简单的相加。该网络主要由Dense块和Transition层组成。 结构介绍： 密集连接：每层都和前馈层和后面的…...
PeaZip：支持200+格式，跨平台解压工具，安全又高效
PeaZip 作为一款功能全面的压缩工具，不仅完全免费且开源，兼容多种主流操作系统，包括 Windows、Linux 和 macOS。它不仅支持常见的压缩格式如 ZIP、RAR、7Z、TAR 和 GZIP，还能处理超过 200 种不同的文件格式，满足用户多…...
go项目使用gentool生成model的gen.go问题
Gen Tool 是一个没有依赖关系的二进制文件，可以用来从数据库生成结构。 使用方法： go install gorm.io/gen/tools/gentoollatest在项目根目录,执行连接的数据库中指定某几张表结构生成数据库model层 gentool -dsn "root:123456tcp(localhost:330…...
物理知识1——电流
说起电流，应该从电荷说起，而说起电荷，应该从原子说起。 1 原子及其结构 常见的物质是由分子构成的，而分子又是由原子构成的，有的分子是由多个原子构成，有的分子只由一个原子构成。而原子的构成如图1所示。…...
VDSuit-FuLL全身惯性动捕设备在人形机器人遥操作的具体应用
随着具身智能的火热，人形机器人遥操作的话题又回到了大众视野。人形机器人的遥操作有众多实现方案，其中基于动作捕捉设备进行人形机器人的遥操作成为了目前业内讨论较多的方向。动作捕捉指的是一种可以实时跟踪、记录、重建角色运动轨迹，并将…...
从零开始学TiDB（8） TiFlash 主要架构
一.TiFlash的主要架构 二.TiFlash 主要功能 1.异步复制 2.一致性读取 T0 时刻从客户端写入两行数据 k1 value100 k999 value7 分别写入到了两个region，并且产生raft log 此时TiFlash还没有TiKV的这两行数据 此时TiFlash同步了key1 value100的数据 还没有同步 …...
LeetCode题解：2625. 扁平化嵌套数组，递归
原题链接 https://leetcode.cn/problems/flatten-deeply-nested-array/ 题目解析 题目要求我们将一个多维数组扁平化到指定的深度。具体来说，我们需要将数组中的子数组扁平化，直到达到给定的深度n。如果子数组的深度大于n，则不进行扁平化。…...
基于深度学习的视觉检测小项目（五） 项目真正的开端
之前的所有都是项目概况和基础知识的铺垫，从今天开始真正进入项目。 首先明确一下项目的流程： • 任务分解分块，并作出每一块的大致功能规划 • 拆解工种，任务分派，约定工种间的接口方式和数据交互方式 • 按照任务块…...
使用ExecutorService和@Async来使用多线程
文章目录 使用ExecutorService和Async来使用多线程采用ExecutorService来使用多线程多线程过程的详细解释注意事项优点 使用Async来使用多线程对比Async和ExecutorService的多线程使用方式使用 ExecutorService 的服务类使用 Async 的服务类异步任务类自定义线程池主应用类解释…...
ArcGIS基础：使用【标识】工具完成分区统计线要素的长度
如上所示，有某个地区的部分管线数据，都是一些线要素。 如上所示，这片区域有好几个管理员，并有自己的管辖范围，现在需要根据这个范围，简单统计一下各自管理员（张三、李四、王五）范围内…...
专业高程转换工具 | 海拔高度与椭球高度在线转换系统
海拔高度转换工具：专业的高程转换系统 在线体验 立即使用 欢迎访问我的博客：https://cdtools.click，这里有更多实用的工具和技术分享。 工具背景 在测绘、工程、GIS 等领域，经常需要处理不同高程系统之间的转换。最常见的需求…...
springboot自定义注解的使用
目录 背景分析代码 背景 需求：对现有系统中所有数据库表都建立一张对应的备份表；在对主表进行增加，修改，删除操作的同时对备份表进行相同的操作。首先想到的应该是备份一个数据库就完事了~不过实际情况没这么简单，总之…...
Wallpaper壁纸制作学习记录13
骨骼物理模拟 Wallpaper Engine还允许您为人偶变形骨骼配置某些物理模拟。选择骨骼时，点击编辑约束来配置骨骼这些属性。 警告 请记住，物理模拟可能会根据用户的最大FPS设置略微改变其行为。 Wallpaper Engine编辑器将始终以高帧速率渲染。您可以将壁纸…...
Linux系统离线部署MySQL详细教程（带每步骤图文教程）
1、登录官网下载对应的安装包 MySQL :: Developer Zone 2、将压缩包上传到服务器上，这里直接上传到/usr/local路径上 使用sftp工具上传到/usr/local目录上 3、解压压缩包 tar -xf mysql-8.0.39-linux-glibc2.17-x86_64.tar.xz 4、将mysql-8.0.39-linux-glibc2.17…...
慧集通iPaaS集成平台低代码训练-实践篇
练习使用帐号信息： 1.致远A8平台（请自行准备测试环境） 慧集通连接器配置相关信息 访问地址： rest账号：rest rest密码： OA账号： 2.云星空（请自行准备测试环境） 连接…...
C程序设计：计算球的体积
问题：根据输入的半径值，计算球的体积。…...
AWS re:Invent 2024 - Dr. Werner Vogels 主题演讲
今年，我有幸亲临现场参加了所有的 keynote，每一场都让我感受到深深的震撼。无论是全新的功能发布，还是令人眼前一亮的新特性展示，每一场 keynote 都精彩纷呈，充满干货，值得反复学习和回味。 恰好ÿ…...
如何使用 `uiautomator2` 控制 Android 设备并模拟应用操作_VIVO手机
在 Android 自动化测试中，uiautomator2 是一个非常强大的工具，能够帮助我们通过 Python 控制 Android 设备执行各种操作。今天，我将通过一个简单的示例，介绍如何使用 uiautomator2 控制 Android 设备，执行特定的应用启动、广告跳过以及其他 UI 操作。此示例的目标是自动化…...
分析服务器 systemctl 启动gozero项目报错的解决方案
### 分析 systemctl start beisen.service 报错 在 Linux 系统中，systemctl 是管理系统和服务的主要工具。当我们尝试重启某个服务时，如果服务启动失败，systemctl 会输出错误信息，帮助我们诊断和解决问题。 本文将通过一个实际的…...
UE蓝图战利品掉落动画
战利品掉落动画，其实就是添加个冲量 add impulse 什么是冲量？ 冲量 （impulse）是作用在物体上的力 在 时间上的累积效果...
Singleton: WebRTC中ThreadManager中的单例模式
1. 什么是单例模式： 旨在确保一个类只有一个实例，并提供全局访问点。 应用场景：需要一个全局唯一的实例，避免资源浪费。 2. 单例模式的实现： Lazy Initialization（懒汉式）（延迟初…...
node.js之---CommonJS 模块
CommonJS概念 在 Node.js 中，CommonJS 是一种模块化规范，它定义了如何在 JavaScript 中创建和使用模块。CommonJS 是 Node.js 使用的默认模块系统。它让开发者能够分离代码，便于重用和维护。 CommonJS 模块的基本特性 模块导出 在 CommonJ…...
LabVIEW 使用 Resample Waveforms VI 实现降采样
在数据采集与信号处理过程中，降采样是一种重要的技术，用于在减少数据点的同时保留信号的关键特性，从而降低存储和计算需求。本文通过 LabVIEW 的 Resample Waveforms (continuous).vi 示例，详细介绍如何使用该功能实现波形数据的降…...
ArrayList 和LinkedList的区别比较
前言 ArrayList和LinkedList的主要区别在于它们的底层数据结构、性能特点以及适用场景。ArrayList和LinkedList从名字分析，他们一个是Array（动态数组）的数据结构，一个是Linked（链表）的数据结构&#x…...
Linux进程控制
进程控制 进程创建系统调用fork()fork()的认识 进程终止进程等待wait/waitpid方法使用 wait/waitpid() 回收子进程 进程程序替换程序替换原理exec*进程替换函数 进程创建 系统调用fork() fork()：一个：Linux系统中的系统调用，用于创建子进程…...
分库分表之后，id 主键如何处理？
面试题 分库分表之后，id 主键如何处理？ 面试官心理分析 其实这是分库分表之后你必然要面对的一个问题，就是 id 咋生成？因为要是分成多个表之后，每个表都是从 1 开始累加，那肯定不对啊，需要一…...
)
矩阵简单问题(Java)
问题： 顺时针打印二维方阵： 1 2 3 4 15 5 6 7 8 14 9 10 11 12 13 13 14 15 16 public class Test1 {public static void main(String[] args) {int[][] arr new int[][]{{1, 2, 3, 4,100},{5, 6, 7, 8,101},{9, 10, 11, 12,102},{13, 14, 15, 16,…...
从0到1：构建全新一代分布式数据架构
从0到1：构建全新一代分布式数据架构 一、分布式数据架构概述 1.1 分布式数据架构的定义 分布式数据架构是指将数据分散存储在多个物理或逻辑位置的计算节点上，并通过计算机网络进行协同工作的系统。这种架构能够提供高可用性、可扩展性和容错性&#…...
OpenGL ES 04 图片数据是怎么写入到对应纹理单元的
从指定路径加载图像并转换为 CGImage。获取图像的宽度和高度。创建一个 RGB 颜色空间。为图像数据分配内存。创建一个位图上下文并将图像绘制到上下文中。创建一个新的纹理对象并绑定到指定的纹理单元。指定二维纹理图像。释放分配的内存。设置纹理参数，包括放大和缩…...
uniapp小程序使用rich-text富文本图片溢出问题
参考https://blog.csdn.net/chenny_/article/details/115534622, 看了很多文章，就这个好使，所以记录一下 在common下新建relpaceImg.js // 正则变量 var graceRichTextReg;// 批量替换的样式 [ 根据项目需求自行设置 ] var GRT [// div 样式[div, &qu…...
)
详解GPT-信息抽取任务 (GPT-3 FAMILY LARGE LANGUAGE MODELS)
GPT-3 FAMILY LARGE LANGUAGE MODELS Information Extraction 自然语言处理信息提取任务（NLP-IE）：从非结构化文本数据中提取结构化数据，例如提取实体、关系和事件 [164]。将非结构化文本数据转换为结构化数据可以实现高效的数据处…...
:网络协议-HTTP/S)
网络基础入门到深入(3):网络协议-HTTP/S
目录 一、HTTP和HTTPS协议简介 1.HTTP协议 .HTTP 协议 作用： 特点： 2.HTTPS协议 作用： 实现方式： 特点： 二.HTTP的请求与响应结构 1.HTTP请求结构 1.请求行:描述操作和资源 2.请求头: 3.请求体 : 2.HTTP…...
Dokcer部署双主Mysql
创建容器： Mysql主1 docker run -d \ --name mysql-master1 \ -e MYSQL_ROOT_PASSWORD123456 \ -v /etc/mysql:/var/lib/mysql \ -p 3306:3306 \mysql:8.01 \ --server-id1 \ --log-binmysql-bin \ --gtid-modeON \ --enforce-gtid-consistencyONMysql主2 docker…...
axios拦截器底层实现原理
Axios 的拦截器通过内部的Promise 链实现了对请求和响应的拦截与修改。了解其底层原理需要深入到 Axios 源码中，特别是其请求发起和响应处理的逻辑。 Axios 拦截器实现流程 拦截器队列 Axios 在内部维护了两个拦截器队列：request 和 response。当开发者…...
《类和对象：基础原理全解析（下篇）》
目录 一、类的构造函数的初始化列表1. 初始化列表的使用2. 初始化列表的初始化顺序3. 使用初始化列表的注意事项 二、类的自动类型转换1. 类的自动类型转换的使用2. 关闭类的自动类型转换 三、静态类成员1. 静态成员的特性2. 使用静态成员计算类创建了多少个对象3. 使用静态类成…...
==和===的区别，被坑的一天
在 JavaScript 中， 和 都用于比较两个值，但它们有一个重要的区别： 1. (宽松相等运算符) 进行比较时，会 自动类型转换（也叫做强制类型转换），即如果比较的两个值的类型不同，JavaScr…...