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,即省心又能快速 ...
随机推荐
- .NET 开源的功能强大的人脸识别 API
前言 人工智能时代,人脸识别技术已成为安全验证.身份识别和用户交互的关键工具. 给大家推荐一款.NET 开源提供了强大的人脸识别 API,工具不仅易于集成,还具备高效处理能力. 本文将介绍一款如何利用 ...
- QT原理与源码分析之QT反射机制原理
QT反射机制原理 本文将介绍QT反射机制创建QT对象实例的原理和流程以及源代码. 文章目录 QT反射机制创建QT对象实例 原理 流程 源码 QT反射机制创建QT对象实例 QT框架提供的基于元对象的反射 ...
- 痞子衡嵌入式:为下一代AI边缘处理设备而生 - i.MXRT700
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是恩智浦i.MX RTxxx系列MCU的新品i.MXRT700. 四年前恩智浦官宣了面向下一代智能穿戴设备的 i.MXRT500 系列,这 ...
- [namespace hdk] string
#include<bits/stdc++.h> using namespace std; namespace hdk{ const int siz=100001; class string ...
- 【VMware VCF】使用 PowerVCF 连接和管理 VMware Cloud Foundation 环境。
VMware 有一个非常强大的命令行工具叫 PowerCLI,该工具是基于 PowerShell 开发的模块,主要用于在 Windows 环境中连接和管理传统虚拟化解决方案,比如 vSphere.vS ...
- 【USB3.0协议学习】Topic3·三种Reset Events分析
USB3.0中的三种Reset Events 1. PowerOn Reset PowerOn Reset被用来代指上电复位,当一个device接入到root hub或者外置hub的时候,该devic ...
- 三维医学图像深度学习,数据增强方法(monai):RandHistogramShiftD, Flipd, Rotate90d
#coding:utf-8 import torch from monai.transforms import Compose, RandHistogramShiftD, Flipd, Rotate9 ...
- 2022年2月国产数据库排行榜: OceanBase“三连增”重夺探花,GaussDB实现本月最大涨幅引期待
寒辞去冬雪,暖带入春风.2022年2月,虎年开年的国产数据库流行度排行榜已在墨天轮社区发布,本月共有195个数据库参与排名.排名前十位的数据库分数增减幅度较大,整体排名略有波动. 首先,我们来看看排行 ...
- apisix~按域名进行请求转发
路由route 路由(Route)是请求的入口点,它定义了客户端请求与服务之间的匹配规则.路由可以与服务(Service).上游(Upstream)关联,一个服务可对应一组路由,一个路由可以对应一个上 ...
- Android复习(二)应用资源 --> 动画
没什么好总结的 复制自 https://developer.android.google.cn/guide/topics/resources/animation-resource 有需要的可以查看官方 ...