Ant Design Pro项目一初始化就报a标签嵌套a标签错误<a> cannot as a descendant of <a>
前情
公司经常需要做一些后台管理页面,我们选择了Ant Design Pro,它是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案。
坑位
按官方文挡一步步下来,项目启动后发现控制台就有一个报错,报错截图如下:

Why?
从报错的提示看是项目出现了a标签嵌套a标签的情况,最终对页面上有跳转功能的地方做了一遍筛查,发现是在面包屑那里出现了a标签嵌套a标签,详情见下图:

解决方案
重写面包屑渲染方法即可,通过在项目下src/app.tsx文件中重写itemRender方法即可
关键代码:
...
itemRender: (route: any, params, routes) => {
return <span>{route.breadcrumbName}</span>
},
...
Ant Design Pro项目一初始化就报a标签嵌套a标签错误<a> cannot as a descendant of <a>的更多相关文章
- Ant Design Pro项目打开页设为登录或者其他页面
Ant Design Pro项目打开页设为登录或者其他页面 一.打开页设为登录页 首先找到utils包中的authority文件,在该文件中找到如下代码: export function getAut ...
- 【后台管理系统】—— Ant Design Pro 项目爬坑(一)
1.表单rule中可以分对象处理不同规则 <FormItem label="类型名称" {...formLayout}> { form.getFieldDecorato ...
- ant design pro(一)安装、目录结构、项目加载启动【原始、以及idea开发】
一.概述 1.1.脚手架概念 编程领域中的“脚手架(Scaffolding)”指的是能够快速搭建项目“骨架”的一类工具.例如大多数的React项目都有src,public,webpack配置文件等等, ...
- 【后台管理系统】—— Ant Design Pro入门学习&项目实践笔记(三)
前言:前一篇记录了[后台管理系统]目前进展开发中遇到的一些应用点,这一篇会梳理一些自己学习Ant Design Pro源码的功能点.附:Ant Design Pro 在线预览地址. Dashboard ...
- 使用ant design pro搭建项目
脚手架搭建 git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project 然后 cd my-proje ...
- 阿里开源项目之Ant Design Pro
本篇文章主要包含的内容有三个方面. 第一.Ant Design Pro简介; 第二.Ant Design Pro能做什么; 第三.初步使用; 我相信通过这三个方面的讲解能让你大概知道Ant Desig ...
- Ant Design Pro+Electron+electron-builder实现React应用脱离浏览器,桌面安装运行
ant-design-pro ----> version :2.3.1 由于网上Ant Design Pro+Electron的资料太少,我就贡献一点经验 最近需要讲AntD Pro项目(以 ...
- ant design pro (十二)advanced UI 测试
一.概述 原文地址:https://pro.ant.design/docs/ui-test-cn UI 测试是项目研发流程中的重要一环,有效的测试用例可以梳理业务需求,保证研发的质量和进度,让工程师可 ...
- Ant Design Pro入门教程,安装,运行(V5 Typescript版)
[前言] 找了很多Admin模板,最后还是看中了AntDesignPro这个阿里巴巴开源的Admin框架,长这样(还行吧,目前挺主流的): 官网地址:https://pro.ant.design/in ...
- Ant Design Pro V5 与 IdentityServer 实现 Password 模式的登录
最近处于休息状态,想趁着休息时间,为自己做一个后台. 后端框架选用了 Abp.之前公司使用了一些自研的框架,但由于人力资源有限,后期框架的升级及维护都是比较耗时,这次干脆直接使用Abp,即省心又能快速 ...
随机推荐
- SpringMVC —— 日期类型参数传递
日期类型参数传递 相关注解 类型转换器
- Filter——过滤器
Filter Filter 快速入门 Filter 执行流程 1.放行前,对 request 数据进行处理 2.放行后,对 response 数据进行处理 ...
- 对 LLM 工具使用进行统一
我们为 LLM 确立了一个跨模型的 统一工具调用 API.有了它,你就可以在不同的模型上使用相同的代码,在 Mistral.Cohere.NousResearch 或 Llama 等模型间自由切换,而 ...
- [OI] 欢夏!邪龙?马拉车!
标题来自原神 算法概述 Manacher 算法 用途:寻找回文串,最板子的情况下用于字符串的回文子串计数 给定一个字符串 \(S\),求出它全部的回文子串 容易想到一种暴力的 \(n^{2}\) 做法 ...
- 暑假集训SCP提高模拟10
我(看着百度百科):我已经知道这场谁组的题了 CTH: 谁 我:你想想,能在模拟赛里塞四道数学题还玩邦的,还能有谁 CTH: 我不知道 我:我不知道 CTH: 我知道了 我:我知道了 我:我是 Bob ...
- USB2.0设备的休眠挂起及远程唤醒
USB可见设备状态,分为连接(Attached),上电(Powered),默认(Default),地址(Address),配置(Configured)和挂起(Suspended)6个状态.所谓可见,即 ...
- 王树森Attention与Self-Attention学习笔记
目录 Seq2Seq + Attention Attention的原理 方法一(Used in the original paper) 方法二(more popular,the same to Tra ...
- Tarjan缩点题单 刷题题解
Tarjan缩点可以将一个图的每个强连通分量缩成一个点,然后构建新图,该图就会变成一个有向无环图.变成有向无环图之后就能结合最短路,拓扑......解决相应题目 洛谷题单分享: https://www ...
- Office365常用的命令(持续更新中)
Office365常用的命令(持续更新中) 持续更新中............. Enable-ExchangeCertificate -Thumbprint B9C93420E7BEE46C1CD2 ...
- 驻扎初篇(markdown)
markdown的初级使用语法 本片作为开始使用博客的第一篇笔记 只为了方便为日后的编辑博客做基础的语言记录 以下为markdown的语法 ##标题 # 标题一 ## 标题二 ### 标题三 #### ...