Не можете найти реагировать компоненту

Question

Это Брось меня ошибка: Не удается найти реагировать компонент myTable .. у меня есть, что реагировать ..

var myTable = React.createClass({ 

    render:function() { 

     return(
      <div> 
       <table className="table scroll2" > 
        <thead> 
        <tr> 
         <td>Start Date</td> 
         <td>End Date</td> 
         <td>Hours</td> 
         <td></td> 
        </tr> 
        </thead> 
        { 
         this.props.list.map(function (item,i) { 
          return(
           <tr> 
            <td>{item.startDate}</td> 
            <td>{item.endDate}</td> 
            <td>{item.workInHours}</td> 
           </tr> 
          ); 
         }) 
        } 
       </table> 
      </div> 
     ); 
    } 
}); 
angular.module('app').value('myTable',myTable); 

и я называю это с этим:

<react-component name="myTable"></react-component> 

Answer 1

Объявить свой компонент как это (обратите внимание Pascal Casing):

var MyTable = React.createClass({ ... }) 

Используйте компонент, как это вместо:

<MyTable /> 

Как Джастин указал правильно, React имена классов должны начинаться с прописной буквы, в противном случае она будет интерпретироваться как HTML тега. Таким образом, многие люди следуют Pascal Case.

Из официальных документов:

To render a React Component, just create a local variable that starts with an upper-case letter

JSX in Depth: HTML Tags vs. React Components

Answer 2

@Mario Tacke Вы правы, за исключением, что он должен быть паскаль обсаженным, если его Реагировать элемент, в противном случае она будет интерпретироваться как элемент тега HTML, а не реагировать.

Подробнее об этом здесь https://gist.github.com/sebmarkbage/f1f4ba40816e7d7848ad