reactComponent.displayName

2018-07-18  本文已影响0人  stonehank

displayName:定义调试时的组件name

例如:

 function withHOC(WrapComponent) {
   // 此处未定义名称或者希望动态定义名称
   return class extends React.Component {
     // 定义displayName
     static displayName = `withHOC(${WrapComponent.displayName || WrapComponent.name})`;
     render(){
       console.log("inside HOC")
       return <WrapComponent {...this.props } />;
     }
   }
 }

 App = withHOC(App);

如果未定义displayName,那么进行调试的时候,就会显示如下:

// react自动定义名称
|---_class2
  |---App
    ...

定义displayName后,显示如下:

|---withHOC(App)
  |---App
    ...
上一篇 下一篇

猜你喜欢

热点阅读