react-router-dom6 路由不合法

news2024/11/26 0:25:43

1、昨天用react-router-dom6搭建了个项目,简直了,一个bug直接给我应用干废了!

2、我试了试不合法的url是如何处理的,随意输入了个反斜杠 http://localhost:8089/#/\

3、结果应用搞岔气了,

image.png 意思是我的url不合法。 这没问题,问题是我需要一个calback或者其他的重置我的应用,不弹出这个界面, 看了下源码,问题找到了:

image.png

没错,就是这位老弟,使用pushState,没有做url的合法处理,

4、接着找啊 有没有再createURL之前处理URL,比如监听事件 哎呀,真让我看到个,贴上来 javaScript let history = { get action() { return action; }, get location() { return getLocation(window, globalHistory); }, listen(fn) { if (listener) { throw new Error("A history only accepts one active listener"); } window.addEventListener(PopStateEventType, handlePop); listener = fn; return () => { window.removeEventListener(PopStateEventType, handlePop); listener = null; }; }, createHref(to) { return createHref(window, to); }, createURL, encodeLocation(to) { // Encode a Location the same way window.location would let url = createURL(to); return { pathname: url.pathname, search: url.search, hash: url.hash }; }, push, replace, go(n) { return globalHistory.go(n); } }; return history; }

image.png

5、URL真的没有处理,再debugger试试

image.png

image.png

6、解决问题 + 修改node_modules包,肯定不行。 + 在路由配置上加个if判断替换所有不合法字符串,并重置应用,但是这不是我想要的。 + 先退回react-router-dom5,等官方解决再用吧

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

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

相关文章

Qt creator之对齐参考线——新增可视化缩进功能

Qt creator随着官方越来越重视,更新频率也在不断加快,今天无意中发现qt creator新版有了对齐参考线,也称可视化缩进Visualize Indent,默认为启用状态。 下图为旧版Qt Creator显示设置栏: 下图为新版本Qt Creator显示设…

ctfshow—萌新—web1

0x00 前言 CTF 加解密合集CTF Web合集 0x01 题目 0x02 Write Up 解法1 标准的数字型注入 查列名 http://cc3ecc3f-8c42-4624-979e-277a51ea85d2.challenge.ctf.show/?id1%20union%20select%20table_name,column_name,3%20from%20information_schema.columns%20where%20t…

Linux—LVM基础

Linux—LVM 一、什么是LVM二、LVM名词解释三、LVM的写入模式四、LVM的工作原理五、LVM的优缺点六、创建PV/VG/LV的方法补充说明 一、什么是LVM LVM(Logical Volume Manager),即逻辑卷管理,是Linux环境下对磁盘分区进行管理的一种…

校园宿舍管理系统java学生楼层宿管 jsp源代码

本项目为前几天收费帮学妹做的一个项目,Java EE JSP项目,在工作环境中基本使用不到,但是很多学校把这个当作编程入门的项目来做,故分享出本项目供初学者参考。 一、项目描述 校园宿舍管理系统 系统有1权限:管理员 二…

代码随想录算法训练营第三十六天|背包理论基础,LeetCode 416

目录 背包理论基础 动态规划五步曲: 1.确定dp[i][j]的含义 2.找出递推公式 3.初始化dp数组 4.确定遍历顺序 5.举例dp数组 背包理论基础II 动态规划五步曲: 1.确定dp[j]含义 2.找出递推公式 3.初始化dp数组 4.确定遍历顺序 5.举例dp数组 L…

[MAUI]在.NET MAUI中实现可拖拽排序列表

.NET MAUI 中提供了拖放(drag-drop)手势识别器,允许用户通过拖动手势来移动控件。在这篇文章中,我们将学习如何使用拖放手势识别器来实现可拖拽排序列表。在本例中,列表中显示不同大小的磁贴(Tile)并且可以拖拽排序。 …

【JavaEE基础学习打卡02】是时候了解Java EE了!

目录 前言一、为什么要学习Java EE二、Java EE规范介绍1.什么是规范?2.什么是Java EE规范?3.Java EE版本 三、Java EE应用程序模型1.模型前置说明2.模型具体说明 总结 前言 📜 本系列教程适用于 Java Web 初学者、爱好者,小白白。…

断点续传的未来发展趋势与前景展望

断点续传是一种在网络传输中断后,能够从中断的位置继续传输的技术。它可以有效地避免因为网络不稳定、服务器故障、用户操作等原因导致的传输失败,节省了用户的时间和流量,提高了传输的效率和可靠性。断点续传在很多场景中都有广泛的应用&…

DEWDROP65 DM蓝牙5.2双模热插拔PCB

键盘使用说明索引(均为出厂默认值) 软件支持(驱动的详细使用帮助)一些常见问题解答(FAQ)首次使用步骤蓝牙配对规则(重要)蓝牙和USB切换键盘默认层默认触发层0的FN键配置的功能默认功…

【Linux】Shell脚本之流程控制语句 if判断、for循环、while循环、case循环判断 + 实战详解[⭐建议收藏!!⭐]

👨‍🎓博主简介 🏅云计算领域优质创作者   🏅华为云开发者社区专家博主   🏅阿里云开发者社区专家博主 💊交流社区:运维交流社区 欢迎大家的加入! 🐋 希望大家多多支…

什么是BP反向传播算法

什么是BP反向传播算法 神经网络是个好工具,但就像有的刀削铁如泥,有的却只能拿来切豆腐。 真正决定神经网络好不好用的是神经元之间连接的权重和神经元的阈值。 如何确定这些数字,大部分时间我们都在使用反向传播,也就是常说的B…

nginx 基础

巩固基础,砥砺前行 。 只有不断重复,才能做到超越自己。 能坚持把简单的事情做到极致,也是不容易的。 nginx简易 #配置负载均衡 upstream myaaa {server localhost:8089;server localhost:8099;}server {listen 8085;server_name lo…

WebRTC | SDP详解

目录 一、SDP标准规范 1. SDP结构 2. SDP内容及type类型 二、WebRTC中的SDP结构 1. 媒体信息描述 (1)SDP中媒体信息格式 i. “artpmap”属性 ii. “afmtp”属性 (2)SSRC与CNAME (3)举个例子 &…

JVM---理解jvm之对象已死怎么判断?

目录 引用计数算法 什么是引用 可达性分析算法(用的最多的) 引用计数算法 定义:在对象中添加一个引用计数器,每当有一个地方引用它时,计数器值就加一;当引用失效时,计数器值就减一&#xff1…

七夕送礼送什么?数码爱好者送什么礼物?这几件贴心实用又有心意

​在这个数字化的时代,数码产品成为了我们日常生活中必不可少的一部分。而在七夕这个特别的日子里,送上一份数码产品礼物,不仅可以让你的另一半感受到你的用心和关爱,还可以让他/她感受到科技带来的便捷和乐趣。 推荐一&#xff…

贝锐蒲公英:助力企业打造稳定高效的智能安防监控网络

随着技术的快速发展和物联网的普及,企业面临着许多安全威胁和风险,如盗窃、入侵、信息泄露等,企业需要建立安防监控系统来保护其资产、员工和业务运营的安全。 然而,企业在搭建安防监控系统的过程中,可能会面临一些难…

无涯教程-Perl - setnetent函数

描述 该函数应在第一次调用getnetent之前调用。 STAYOPEN参数是可选的,在大多数系统上未使用。当getnetent()从网络数据库的下一行检索信息时,setnetent会将枚举设置(或重置)为主机条目集的开头。 语法 以下是此函数的简单语法- setnetent STAYOPEN返回值 此函数不返回任何…

smardaten实战丨谁说无代码不能开发出漂亮的门户首页?

一、需求背景 门户首页对于一个公司或组织来说是一个极其重要的网站页面,它可以作为访问者了解和获取相关信息的入口,同时也是展示品牌形象和吸引目标受众的重要工具。 开发一个门户首页需要开发团队在向访问者展示关于公司或组织基本信息的基础上&…

CentOS7最小化安装使用KVM虚拟化

说明:本文初衷在于记录一次实战经验,以便后续参考,不具有任何权威作用,如若对你有帮助深感荣幸! 一、环境安装 CentOS Linux release 7.9.2009 (Core)【不带GUI】Xshell 6Xmanager 6 # 执行 export DISPLAY客户端机器…

onnx onnxruntime onnxruntime-gpu

一、onnx简介 在训练模型时可以使用很多不同的框架,比如 Pytorch, TensorFLow, MXNet,以及深度学习最开始流行的 Caffe 等等,这样不同的训练框架就导致了产生不同的模型结果包,在模型进行部署推理时就需要不…