고위 구성 요소가 반응에서 작동하지 않는 이유는 무엇입니까? .I를 작동하지 않는이 상위 컴퍼넌트가 버튼을 <code>HOC</code>를 사용하여 라벨을 보여주기 위해 노력하고있는 이유

Question

당신은 말씀 해주십시오라도 좋습니다는

http://codepen.io/anon/pen/ygpVeZ

var D = (comp) => class extends React.Component{ 
    render(){ 
    return (<comp/>) 
    } 
} 

class A extends React.Component { 
    render(){ 
    return (
     <button>hrllo</button> 
    ) 
    } 
} 
class B extends React.Component { 
    render(){ 
    return (
     <label> hello</label> 
    ) 
    } 
} 

const PP =D(B) 
const PPP =D(A) 

class C extends React.Component { 
    render(){ 
    return (
     <div> 
     <PP></PP> 
      <PPP></PPP> 
     </div> 

    ) 
    } 
} 

ReactDOM.render(<C/>,document.getElementById('root')) 

Answer 1

구성 요소가 대문자로 시작해야합니다 반작용 내 코드입니다 docs에서 읽을 수 있습니다.

대문자 화 된 유형은 JSX 태그가 React 구성 요소를 나타냄을 나타냅니다. 이러한 태그는 명명 된 변수 에 대한 직접 참조로 컴파일되므로 JSX 표현식을 사용하는 경우 Foo는 범위에 이어야합니다.

var D = (comp) => class extends React.Component{ 
    render(){ 
    return (<comp/>) 
    } 
} 

답변

var D = (Comp) => class extends React.Component{ 
    render(){ 
    return (<Comp/>) 
    } 
} 

codepen