React AntD的Dropdown组件报错:React.Children.only expected to receive a single React element child.可能的n原因
React.Children.only expected to receive a single React element child.
Error: React.Children.only expected to receive a single React element child. at Object.onlyChild [as only] (http://127.0.0.1:5173/node_modules/.vite/deps/chunk-AWAXCICB.js?v=d48d4aee:803:21) at Dropdown2 (http://127.0.0.1:5173/node_modules/.vite/deps/antd.js?v=d48d4aee:29936:35)
······
这个报错很明显,提示我们React Children.只应接收单个React元素的子项,然后我们去检查,代码,是单一子元素啊,em...
下面总结原因:
1、不换行报错(最离谱)
错误代码:
<Dropdown menu={ {items:headerMenus} }><span >user</span> </Dropdown >
改成如下错误消失:
<Dropdown menu={{ items: headerMenus }}>
<span>user</span>
</Dropdown>
2、子元素确实不是唯一的
比如:
<Dropdown menu={{ items: headerMenus }}>
<span>user </span>
<span></span>
</Dropdown>
3、menu属性传递的值不是一个带有items属性的对象
这就属于看antd的文档不仔细了,但是这个报错提示确实可谓谬以千里了。。。
React AntD的Dropdown组件报错:React.Children.only expected to receive a single React element child.可能的n原因的更多相关文章
- React报错之React.Children.only expected to receive single React element child
总览 当我们把多个子元素传递给一个只期望有一个React子元素的组件时,会产生"React.Children.only expected to receive single React el ...
- 安装skype for business server组件 报错“未满足先决条件”和安装KB2982006补丁提示“此更新不适用于你的计算机”
安装skype for business server组件 报错“未满足先决条件” 上网经查询发现是没有安装KB2982006-x64 更新补丁 去官网上找这个补丁,发现这个补丁要热更新啥的,还要写邮 ...
- VUE基础之:visible.sync-模态框显示隐藏、elementUI dialog组件报错或者visible属性不生效问题
VUE基础之:visible.sync-模态框显示隐藏.elementUI dialog组件报错或者visible属性不生效问题 这篇文档存成草稿2年了,最近终于有时间拉出来写完了.... 我们日常开 ...
- Navicat 用ssh通道连接时总是报错 (报错信息:SSH:expected key exchange group packet form serve
转:https://blog.csdn.net/qq_27463323/article/details/76830731 之前下了一个Navicat 11.0 版本 用ssh通道连接时总是报错 (报错 ...
- React使用antd按需引入报错
引言 按照antd官网配置按需引入,还是出现一系列的报错: 原因 在网上搜了一下,大部分说是react-scripts以及react-app-rewired版本不兼容的问题,我果断把下载低版本 npm ...
- node+react 打包成功,控制台报错
控制台报错: 'ReactCurrentOwner' of undefined 解决办法:RN版本的问题. As I mentioned, make sure you've installed the ...
- 创建新react项目 运行npm start 报错踩过的坑
1.看react官网创建新的react项目 :npx create-react-app my-app cd到my-app npm start 遇见如下报错 这是因为电脑本地git的原因 ,不是 ...
- react脚手架抽离webpack报错解决
我们在写react项目的时候,可能原有的webpack配置不满足我们的需求,需要自己去配置,可是你在创建脚手架的时候并不能在外部找到webpack文件,脚手架的webpack文件在node_modul ...
- react服务端渲染同构报错Browser history needs a DOM
https://github.com/nozzle/react-static/issues/343 去掉了browserRouter就不报错了,但是又会有其他报错..
- 六、react添加多个className报错解决方法
例如<div className={style.calss1,style.class2}></div> 该方法会报错 想得到最终渲染的结果:<div class='cla ...
随机推荐
- 精选4款基于.NET开源、功能强大的通讯调试工具
前言 今天大姚给大家分享4款基于.NET开源.功能强大的通讯调试工具,旨在帮助.NET开发者们更好的应对通讯调试方面的学习和工作,提升调试效率. LLCOM LLCOM是一个.NET开源的.功能强大的 ...
- [BZOJ4605] 崂山白花蛇草水 题解
突然想买一瓶,然后喝上几口.(不要命的想法) 动态全局 \(k\) 大想到权值线段树上二分. 由于要存储二维的点,所以得用到我们神通广大的 \(KDT\) 了. 那么想到权值线段树套 \(KDT\) ...
- 当向json数组追加节点时,再去修改它,发现所有的该节点的数据都被修改了
当向一个json数组追加的节点被修改时,所有对象的的节点都被修改了 众所周知,追加json节点时,我们通常会直接给不存在的节点赋值 比如这样: let json = [ { id:'1' }, { i ...
- 【COM3D2Mod 制作教程(2)】Mod 底层原理
[COM3D2Mod 制作教程(2)]Mod 底层原理 Mod 是什么? Mod 一词想必你已经听过很多次了,因为很多游戏都可以装 Mod,而 Mod 可以为游戏增添一些额外的乐趣.但在 COM3D2 ...
- yarn的安装与配置(秒懂yarn用法)
安装和配置Yarn可以通过以下步骤完成: 安装Node.js:首先,确保已经安装了Node.js.可以通过在终端中运行node -v来检查是否已安装.如果没有安装,可以从Node.js官方网站(htt ...
- docker下安装Harbor
安装docker-compose # 安装docker-compose curl -L https://github.com/docker/compose/releases/download/1.18 ...
- 基于项目的协同过滤推荐算法(Item-Based Collaborative Filtering Recommendation Algorithms)
前言 协同过滤推荐系统,包括基于用户的.基于项目的息肉通过率等,今天我们读一篇基于项目的协同过滤算法的论文. 今天读的论文为一篇名叫<基于项目的协同过滤推荐算法>(Item-Based C ...
- 豆包:php如何模拟多客户端访问服务器
在 PHP 中模拟多客户端访问服务器可以通过以下几种方式实现,具体方法根据需求选择: 方法 1:使用 cURL 多请求(Multi Handle) 通过 curl_multi_* 系列函数实现并发 ...
- k8s node节点报错 dial tcp 127.0.0.1:8080: connect: connection refused
前言 在搭建好 kubernetes 环境后,master 节点拥有 control-plane 权限,可以正常使用 kubectl. 但其他 node 节点无法使用 kubectl 命令,即使同步过 ...
- linux clickhouse 密码设置
默认密码 clickhouse 安装好之后,系统默认的登录账号密码是 /etc/clickhouse-server/users.d/default-password.xml 文件中配置的,默认密码是 ...