在 this.props.children 中有一些子组件的 react 组件渲染方法中。如何获取每个孩子的组件（类）名称以区分它们？
React.Children.map(this.props.children, function(child){
// how can I get the class name of a child or some other identifier
})
如何在 this.props.children 中访问 React 对象的类名
IT技术
javascript
reactjs
2021-05-20 15:53:31
3个回答
警告：如果使用缩小，这在生产中将不起作用
在 ES6 中，每个函数的名称都存储在属性中，function.name因此您可以使用
import React from 'react'
...
getNameOfChildrenClass() {
const singleChild = React.children.only(this.props.children),
childClass = child.type
return childClass.name
}
我正在使用React.children实用程序
与@Vaclav 相同，但如果您使用的是 redux connect，您将获得“Connect”作为名称，这可能会导致问题。这是我的改进版本：
let{ name, displayName=name } = child.type;
React.cloneElement(child, {
...
key:displayName,
});
我想你想要的是child._currentElement.type.displayName但我会小心使用这样的内部结构，除非你想仔细检查它们在每次升级中是否仍然正常工作。我认为没有用于获取组件名称的公共 api。