2016-11-18 12 views
0

React.jsのMicrosoftチュートリアルhereに続いて。React.js未定義関数

私は何度も繰り返すように、リストを関数にマップしようとしています。私が手にエラーがある

{[1,2,3].map(this.renderInboxItem)} 

これはエラーがあるコードの主要な部分は何かということです

var React = require('react'); 
var ReactDOM = require('react-dom'); 
var sample = require('./sample-data.js'); 

var App = React.createClass({ 

    renderInboxItem: function(){ 
    return <h1> Test </h1> 
    }, 
    getInitialState: function() { 
    return { 
     "humans":{}, 
     "store":{} 
    }; 
    }, 
    loadSampleData: function(){ 
    this.setState(sample); 
    }, 
    render : function() { 
    return (
     <div> 
     <div id="header"></div> 
     <button onClick={this.loadSampleData}> loadSampleData </button> 
     <div className="container"> 
      <div className="column"> 
      <InboxPane humans={this.state.humans} /> 
      </div> 
      <div className="column"></div> 
      <div className="column"></div> 
     </div> 
     </div> 
    ) 
    } 
}); 

var InboxPane = React.createClass({ 
    render : function() { 
    return (
     <div id="inbox-pane"> 
     <h1>Inbox</h1> 
     <table> 
      <thead> 
      <tr> 
       <th>Chat Received</th> 
       <th>Name</th> 
       <th>Status</th> 
      </tr> 
      </thead> 
      <tbody> 
     {[1,2,3].map(this.renderInboxItem)} 


      </tbody> 
     </table> 
     </div> 
    ) 
    } 
}); 

var InboxItem = React.createClass({ 
    render: function(){ 
    return (
     <tr> 
     <td>5PM</td> 
     <td>Rami Loves Pizza</td> 
     <td>Order Sent</td> 
     </tr> 
    ) 
    } 
}); 

ReactDOM.render(<App/>, document.getElementById('main')); 

答えて

1

renderInboxItem:ここ

bundle.js:8488 Uncaught TypeError: undefined is not a function 

は完全なコードですAppクラスで定義されていますが、あなたのInboxPaneクラスで呼び出しています存在しません。メソッドをInboxPaneに移動します。