2016-07-14 3 views
4

저는 클라이언트 측에서 React를 사용하여 응용 프로그램의보기를 렌더링하고 있습니다.모호한 오류 메시지를 보냅니다 : "Constructor`의 렌더링 방법을 확인하십시오."

브라우저 콘솔에서 오류보고를 볼 때 오류가 발생한 클래스의 적절한 이름 대신 Check the render method of 'Constructor'으로 오류가 표시되는 경우가 있습니다.

Warning: Each child in an array or iterator should have a unique "key" prop. 
Check the render method of `Constructor`. See https://<fb.me>/react-warning-keys for more information. 

왜 내 클래스의 이름은 Constructor으로 나타나고있다 :

예를 들어, 나는 같은 메시지가 나타납니다? 클래스 이름을 올바르게 표시하려면 React를 어떻게 얻습니까?


기타 자세한 사항 :

  • 현재 나는 내 수업의 일부의 상호 작용을 촉진하기 https://github.com/clayallsopp/react.backbone에서 React.createBackboneClass()을 사용하여 만든
  • React.createClass() (즉, 하지 ES6 방식)를 사용하여 클래스를 생성 레거시 백본 모델/컬렉션에 대응
  • gulpbabel을 사용하여 y JSX 파일.

답변

5

createClass으로 만든 구성 요소에 적절한 displayName이 없기 때문에 이런 일이 발생했습니다. 응용 프로그램의 각 구성 요소에 표시 이름을 쓰면 정상적인 메시지가 표시됩니다.

UPD 예 :

: 가입일

const SomeComponent = React.createClass({ 
    displayName: 'SomeComponent', 
    ... 
    render() { 
     ... 
    } 
}); 

export default SomeComponent; 
+1

예 : – Jack

+1

도움이 내 대답을 업데이 트했습니다 :

이 시도 – steppefox

1

React Docs 다음 displayName 문자열 (D)에서 사용된다 string displayName

나 displayName ebugging messages. JSX는이 값을 자동으로 설정합니다.

var Hello = React.createClass({ 

    displayName: 'Hello World', // here 

    render: function() { 
    console.log(this.displayName); 
    return <div>Hello {this.props.name}</div>; 
    } 
}); 
관련 문제