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,即省心又能快速 ...
随机推荐
- eclipse真的落后了嘛?这几点优势其他IDE比不上
序言 各位好啊,我是会编程的蜗牛,作为java开发者,我们每天都要和开发工具打交道.我以前一开始入门java开发的时候,就是用的eclipse,虽然感觉有点繁琐,但好在还能用.后来偶然间发现了IDEA ...
- 了解 Flutter 3.16 功能更新
作者 / Kevin Chisholm 我们在季度 Flutter 稳定版发布会上带来了 Flutter 3.16,此版本包含诸多更新: Material 3 成为新的默认主题.为 Android 带 ...
- 即刻报名 | Flutter Engage China 线上见!
在刚刚过去的 Flutter Engage 活动上,我们正式发布了 Flutter 2: 为任何平台创建美观.快速且可移植应用的能力得以更上一层楼.通过 Flutter 2,开发者可以使用相同的代码库 ...
- 加入 Flutter Engage,Pick 您的专属 Dash 形象!
Flutter Engage 活动精彩来袭 对 Flutter 团队的开发者们来说,交流的重要性不言而喻,和您一样,我们也希望开发者们能够在不同的情境下进行互动分享.于是我们为您准备了一场特别的线上活 ...
- [TK] 三角蛋糕 hzoi-tg#261
同机房大佬也写了这道题的 题解. 我在另一篇 题解 中提到了这类问题的通解,接下来我们依照此通解思考该题. 问题处理 首先我们来定义三角形的表示方式. 定义 \(f[i][j]\) 表示三角形 \(( ...
- UEFI原理与编程(三)
1 开发UEFI服务 本质Protocol 就是包含属性和函数指针的结构体,功能上来说就是提供者和使用者对服务的一种约定. 2 开发UEFI驱动 一个设备/总线驱动程序在安装时首要找到对应的硬件设备( ...
- HarmonyOS NEXT开发之ArkTS自定义组件学习笔记
在HarmonyOS中,ArkTS提供了创建自定义组件的能力,允许开发者封装和复用UI代码.以下是关于自定义组件的详细介绍,包括创建自定义组件.页面和自定义组件的生命周期.自定义组件的自定义布局.冻结 ...
- 5.29 杭州站云原生 Meetup,邀您观看线上同步直播
5 月 15 日在上海组织的云原生 Meetup,除了现场火爆.人数爆满之外,同步进行的线上直播也同样受到了广大社区小伙伴的关注,在线观看直播人数足有千人之众. 为了能让更多的社区小伙伴能够参与到 M ...
- thinkphp5 模型批量增加数据小记
楼主最近在学习thinkphp5,真的没应广大使用教程所说:你最好就是没学过thinkphp3.2.要不然苦恼重重. 因为想将一些功能实现一次,故自己写了一个文件上传类. 可以实现单文件,多文件上传( ...
- Elasticsearch倒排索引结构【转载】
一切设计都是为了提高搜索的性能 倒排索引(Inverted Index)也叫反向索引,有反向索引必有正向索引.通俗地来讲,正向索引是通过key找value,反向索引则是通过value找key. 先来回 ...