React.NET uncaught TypeError：undefined不是函数

Question

我正在尝试学习ReactJs并找到了React.NET。

遵循作者website上的教程，唯一的变化是MVC 5应用程序而不是MVC 4。

这是jsx：

/** @jsx React.DOM */
var CommentBox = React.createClass({
  render: function() {
    return (
      <div className="commentBox">
        <h1>Comments</h1>
        <CommentList data={this.props.data} />
        <CommentForm />
      </div>
    );
  }
});

React.renderComponent(
  <CommentBox data={data} />,
  document.getElementById('content')
);


var CommentList = React.createClass({
  render: function() {
    var commentNodes = this.props.data.map(function (comment) {
      return <Comment author={comment.Author}>{comment.Text}</Comment>;
    });
    return (
      <div className="commentList">
        {commentNodes}
      </div>
    );
  }
});


var CommentForm = React.createClass({
  render: function() {
    return (
      <div className="commentForm">
        Hello, world! I am a CommentForm.
      </div>
    );
  }
});

var data = [
  { Author: "Daniel Lo Nigro", Text: "Hello ReactJS.NET World!" },
  { Author: "Pete Hunt", Text: "This is one comment" },
  { Author: "Jordan Walke", Text: "This is *another* comment" }
];

它给出了这个错误：

  

未捕获的TypeError：undefined不是函数

有关此问题的任何线索吗？

问候。

Answer 1

摘录中有三个步骤。

首先，定义CommentBox：

var CommentBox = React.createClass...

其次，渲染CommentBox和CommentList：

React.renderComponent...

第三，定义CommentList：

var CommentList = React.createClass...

所以，问题是CommentList在定义CommentList之前呈现。如果最后两个步骤被切换，那么它将正常工作。 CommentList类需要先定义才能呈现。

Answer 2

CommentForm也定义在错误的位置 - 它需要在引用之前定义。 React教程的方法错误：http://facebook.github.io/react/docs/tutorial.html

Javascript中定义类的正确顺序是：

var Comment = React.createClass

...
var CommentList = React.createClass

...
var CommentForm = React.createClass

...
var CommentBox = React.createClass

...

Answer 3

我在完成本教程时遇到了这种情况，并发现在jsx脚本顶部声明var data = [...]解决了这个问题。那么看起来发动机没有正确提升变量？