如何在基于类的组件中设置 displayName？

Question

我正在尝试设置displayName扩展React.Component. 该阵营的文档说displayName是一个属性，因此它可以设置它在构造函数？这是我正在尝试的：

class TestUI extends React.Component {
   constructor(){
     this.displayName = 'CustomTestUI'
   }
}

但是我正在使用的库 ( pacomo ) 没有选择它。我设置不正确吗？我也试过将它设置在类之外，比如无状态组件 MyClass.displayName = 'Test' 这也没有效果。

编辑：答案是： static displayName = 'CustomTestUI'

Answer 1

正如注释中所述，displayName应该在类上设置为静态变量，而不是使用this.

class TestUI extends React.Component {
   static displayName = 'CustomTestUI';
   ...
}

以下是 React 从此错误和此函数displayName中的组件类检索的几个示例。

您还可以displayName通过 来设置组件的Component.displayName = 'myName'。

class TestUI extends React.Component {
    ...
}

TestUI.displayName = 'CustomTestUI';