React.js未定义的函数

时间:2016-11-18 05:51:44

标签: javascript reactjs

遵循React.js上的Microsoft教程here

我正在尝试将列表映射到函数,因此它会重复多次。

这就是错误的主要代码:

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

我得到的错误是:

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

以下是完整代码:

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 个答案:

答案 0 :(得分:1)

renderInboxItem已在您的App课程中定义,但您在InboxPane课程中调用它并且不存在。{p> InboxPane将方法移至private IEnumerable<string> readFile(string fName) { using (FileStream reader = new FileStream(fName, FileMode.Open, FileAccess.Read)) { int i = 0; StringBuilder lineBuffer = new StringBuilder(); int byteRead; while (-i < reader.Length) { reader.Seek(--i, SeekOrigin.End); byteRead = reader.ReadByte(); if (byteRead == 10 && lineBuffer.Length > 0) { yield return ReverseString(lineBuffer.ToString()); lineBuffer.Remove(0, lineBuffer.Length); } lineBuffer.Append((char)byteRead); } yield return ReverseString(lineBuffer.ToString()); reader.Close(); } } public static string ReverseString(string s) { char[] arr = s.ToCharArray(); Array.Reverse(arr); return new string(arr); }