react-antD 下拉框组件使用出现的问题(antd版本问题)-menus

项目场景:

下拉框选择操作


问题描述

用了朋友写的一个文件上传组件,加到了自己的项目里面,以为是省事,结果踩了坑

先看浏览器报错信息,如图:

html 复制代码
ERROR
React.Children.only expected to receive a single React element child.
    at Object.onlyChild [as only] (http://localhost:2028/static/js/bundle.js:237997:15)
    at renderOverlay (http://localhost:2028/static/js/bundle.js:43267:34)
    at getOverlayElement (http://localhost:2028/static/js/bundle.js:160204:24)
    at getMenuElement (http://localhost:2028/static/js/bundle.js:160225:26)

相关代码:


原因分析:

可能是antD版本问题(朋友项目用的都是antD 5+),然后去看了官方文档,官方文档这个部分正好有这个内容上提示; 目前项目上使用的是"antd": "4.23.6",正好在这个范围内,这个组件是4.24.0 版本后的;那,我改!


解决方案:

出现问题,那就去解决问题,改!用这个版本的写法;

这个是改后的写法;仅供参考(主要还是overlay的问题)

解决,记录一下,笔记是个好东西,当你写的多的时候,真的是记不住。

相关推荐
肥肠可耐的西西公主1 分钟前
前端(AJAX)学习笔记(CLASS 2):图书管理案例以及图片上传
前端·笔记·学习
大胖丫2 分钟前
vue 学习-vite api.js
开发语言·前端·javascript
孙桂月4 分钟前
ES6相关操作(2)
前端·javascript·es6
遇见很ok4 分钟前
js中 ES6 新特性详解
开发语言·javascript·es6
陈浩源同学4 分钟前
学习 TypeScript 栈和队列数据结构
前端·算法
我这一生如履薄冰~6 分钟前
简单封装一个websocket构造函数
前端·javascript·websocket
fangcaojushi6 分钟前
解决webpack5.54打包图片及图标的问题
前端·vue.js
海盗强7 分钟前
Webpack打包优化
前端·webpack·node.js
星之卡比*9 分钟前
前端面试题---vite和webpack的区别
前端·面试
^^为欢几何^^14 分钟前
npm、pnpm和yarn有什么区别
前端·npm·node.js