쓰기 기능은 구성 요소

Question

반응 I 기능 abc는 반응 클래스의 외부에서 정의이

function abc(){ 
    return 'abc' 
} 
class MyComponent extends React.Component { 
    static abc = abc; 
    render() { return <h1>{this.abc}</h1>; } 
} 

같은 코드를 본 적이있다. 저자가 왜 그렇게했는지, 왜 수업 내에서 그렇게 할 수 없는지에 대한 단서가 없습니다.

Answer 1

이들은 ES6 static methods이며 React에만 해당하는 것은 아닙니다. 이들은 컴포넌트 클래스의 멤버이지 컴포넌트의 인스턴스가 아닙니다. 그들은 React에서 광범위하게 사용되지 않지만 유용 할 수 있습니다. React docs에 언급 된 경우도 있습니다.

때때로 React 구성 요소에 정적 메서드를 정의하는 것이 유용합니다. 예를 들어, 릴레이 컨테이너는 정적 메서드 getFragment를 으로 노출시켜 GraphQL 조각의 구성을 용이하게합니다.

모든 구성 요소가 공유하는 구성 요소의 공통 구성원으로 사용할 수 있습니다. 아이디어를 제공하기 위해 static members of a React class은 displayName 및 defaultProps입니다.

Static methods in React도 참조하십시오. 보시다시피, 정적 메서드를 사용하는 경우는 많지 않습니다.