reactjs - 在 React 中获取组件名称

Question

我正在开发一个 React 应用程序。我有一个 Loading 组件，它是一个等待的小动画。我想根据调用它的组件在此 Loading 组件中添加一条消息。

这是我调用加载组件的方式(this.state.displayLoading 为 true 或 false):

class LoginForm extends React.Component {
    render() {   
        return (
            <div className="login-form-root">
                 {this.state.displayLoading && <Loading loadingFrom={?}/>}
            </div>
        );
    }
}

我想在我的变量loadingFrom中获取“LoginForm”，它是类名。也许这不是正确的方法。

Answer 1

类组件

您可以使用this.constructor.name来获取组件的名称。

(撰写本文时使用 React 16.x)

警告:如果您使用 Webpack 进行缩小生产，这将不起作用。

功能组件

https://reactjs.org/docs/react-component.html#displayname