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,即省心又能快速 ...
随机推荐
- Windows系统无法打开‘’网络发现‘’功能
Windows10无法开启网络发现 解决办法: 1. services.msc 2. 开启 SSDP Discovery ,设置 启动类型为 自动 ,服务状态为 启动 Windows7 无法开启网络发 ...
- 基于全息感知的智慧高速IT设施监控运维方案
作为智能交通的重要细分领域,建设智慧高速是实施交通强国战略的重要基础.在信息化时代,交通行业已经依托信息化建设取得了显著的成果,其中以收费网络.办公网络.监控网络和通讯网络为基础的网络架构已经形成,并 ...
- iOS中使用UITextView设置不同文本部分点击事件小结
最近在项目开发中遇到了设置多行文本,点击蓝色邮箱部分跳转到发邮件页面功能.当然比较简单的方式是多标签单独设置,那样稍显麻烦.我们能不能用一个控件,给某一部分添加点击事件,结果是可以的,UITextVi ...
- .Net 反射和特性
学习:.net 反射简单介绍 - WebEnh - 博客园 (cnblogs.com) 反射就是通过反射程序集从而获取相关信息 十月的韩流 使用了特性就必定会使用反射 var res = obj.Ge ...
- 怎么根据token的有⽆去控制路由的跳转?进度条跳转 - 白名单是否有token - 单独封装文件permission .js
vue这边的路由⾃带了路由前置守卫,我们可以在前置守卫⾥拿到token数据,然后根据需求做分⽀判 断,要是token存在就使⽤next⽅法正常放⾏跳转,否则可以强制跳回到登录,让⽤户去获取token ...
- python中的时间处理
python程序编写中的时间处理涉及三种: 1.时间的显示: 2.时间的转换: 3.时间的运算. 时间处理模块:time模块 时间的三种表示方式: ①时间戳,从1970年1月1日开始,每过1s增加1, ...
- 二、java之面向对象
面向对象 面向对象编程(Object-Oriented Programming,OOP) 面向对象编程的本质就是:以类的方式组织代码,以对象的组织(封装)数据 三大特性: ◆封装 ◆◆封装的概念 程序 ...
- CSP模拟10--总结
今天是我第一次给模拟赛写正规总结--因为今天的题真的受不了了 四道数学题,一点都不拖泥带水的纯血数学题! T1.黑暗型高松灯 shit 本来是一道放在T4防AK的题,结果学长为了 恶心 锻炼一下我们, ...
- awk 处理 Git 提交信息生成 Release Note
发布软件时通常都会写 Release Note,但每次从头手打也有点累,可以考虑从 Git 的提交历史中自动生成. Git 提交信息一般是三段式结构,段落之间使用空行隔开: <subject&g ...
- DRF-Version组件源码分析
1. 版本管理组件源码分析 注意点: 不同的versioning_class区别:实例化后得到的对象versioning_scheme里面的方法不同(函数同名,但是处理逻辑不同) def determ ...