Reactjs JSX中字符串的动态标记名

我正在尝试创建一个包含

react material ui

中所有图标的页面。我已经找到了，但它对我不起作用

我可以创建标记，但它会转换为所有小写

这是我的渲染函数

render: function () {
   return (
      <AppCanvas>
         <AppBar title="Crowd Invest"
                iconElementLeft={<IconButton> <MUI.Libs.SvgIcons.ActionAccessibility/> </IconButton>}/>

         <div style={{padding: '80px',}}>
            {this.allIcons()}
         </div>
      </AppCanvas>
   );
}

所有图标都被渲染，但标记都是小写的。这是其中一个条目：

<mui.libs.svgicons.actionaccessibility 
    name="MUI.Libs.SvgIcons.ActionAccessibility" 
    data-reactid=".0.$=11.$7615d95988e7d7f1098cd4f1">
</mui.libs.svgicons.actionaccessibility>

---

这显然行不通。我需要更改什么才能进行渲染？

这需要更多的向上投票。显然，react只在小范围内呈现html标记。如果您不需要react键，一个肮脏的方法就是使用

危险的setinenerHTML

。这需要更多的投票。显然，react只在小范围内呈现html标记。如果您不需要react键，一种肮脏的方法就是使用

危险的setinenerHTML

。

<mui.libs.svgicons.actionaccessibility 
    name="MUI.Libs.SvgIcons.ActionAccessibility" 
    data-reactid=".0.$=11.$7615d95988e7d7f1098cd4f1">
</mui.libs.svgicons.actionaccessibility>