ant5中，menu组件动态渲染icon问题

react17 + antd5开发

因为目前antd5移除了menu.item子级，而是通过menu组件的items属性来控制整个菜单的内容
eg:<Menu items={{ [菜单数组]  }}>
我的痛点是在渲染菜单前我需要对items处理，而icon是作为一个字符串存在数据库中，所以数据返回后我需要改为reactNode类型
经排查后

import * as Icon from "@ant-design/icons" //引入*以满足动态渲染
... ...
list.map(item=>{
   item.icon = React.createElement(Icons[item.icon])
})

但是前端却报错：

element type is invalid : expect a string (...) or a class/fuction (for...) but got undefined ...

前一天下班认为是自己的方法不对困扰许久，结果今早上再次看到报错就认真读了一遍，这个地方需要的是一个函数，类或者字符串，而我写的是一个reactNode，所以我直接就是一个

item.icon = ()=>React.createElement(Icons[item.icon])

结果，编译通过了但是控制台报了其他错

后来发现自己mock数据的icon字段设置有误

不能是"<XXX>" "<XXX / >" "/XXX"

直接改为"XXX"icon名称的字符串本身即可
因为自己粗心钻到死胡同，血泪经验供大家参考~