为什么我的带有child.type.name的自定义组件为每个组件都返回一个“ t”？

Question

我有一个奇怪的问题，只有在构建我的React App时才会发生，也许有人可以帮助我解释发生了什么？

我用这样的自定义组件创建了一个表单：

<Form>
    <Input type="text" name="name" value="">Description</Input>
    <Textarea name="name" value="">Message</Textarea>
    <Submit>Send Request</Submit>
</Form>

当我在本地主机上运行此安装程序时，当我调用child.type.name时，每个组件都会返回其真实名称（例如Input，Textarea和Submit），但是当我在构建包中运行完全相同的结构时，它将返回他们每个人都“ t”？

Answer 1

通过Webpack的UglifyJS正在为您解决这个问题。

如果要使用child.name来标识组件，最好定义displayName并使用child.type.displayName

通过以下方式将其添加到任何React组件中：

static displayName = 'coolComponentName'