Gem 一覧へ戻る
jurassix/react-display-name(新しいタブで開きます)
主要言語: JavaScript
utility to return a react components display name
- star 数
- 59
- watcher 数
- 2
- fork 数
- 5
- issue 数
- 11
- 最終更新
- 2022/12/31
主要言語: JavaScript
utility to return a react components display name
npm install --save react-display-name
Get the displayName from a Component. This is a common pattern with React Higher Order Components (HoCs). This is a simple reusable utility to get the name of a component.
Usage:
import {expect} from 'chai'; import React, {Component} from 'react'; import getDisplayName from 'react-display-name'; const container = (WrappedComponent) => { class Container extends Component { static displayName = `Container(${getDisplayName(WrappedComponent)})`; render() { return ( <WrappedComponent /> ); } } return Container; } class HelloWorld extends Component { render() { return ( <div>Hello</div> ); } } const HelloWorldPrime = container(HelloWorld); expect(getDisplayName(HelloWorldPrime)).to.equal('Container(HelloWorld)'); expect(HelloWorldPrime.displayName).to.equal('Container(HelloWorld)');