在 CommentBox 中，这一行是问题所在： <CommentList data={this.props.data} />

props.data由于您传入的是 URL 而不是 JS 对象，因此您不再拥有。

您的第二个有效，因为您使用 state 并将值默认为一个空数组，该数组仍然可以在其上运行地图。

我也有这个确切的问题 - 教程在这一点上没有说清楚，但我认为该应用程序实际上不应该在此时正确加载数据。如果您继续学习本教程，它会让您使用加载数据的 this.props.url 构建一个 ajax 调用。仅供其他可能感到困惑的人使用，继续按，一切都很好！

这个有效。

/** @jsx React.DOM */

var converter = new Showdown.converter();

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

var Comment = React.createClass({
  render: function() {
  var rawMarkup = converter.makeHtml(this.props.children.toString());
    return (
      <div className="comment">
        <h2 className="commentAuthor">
          {this.props.author}
        </h2>
        <span dangerouslySetInnerHTML={{__html: rawMarkup}} />
      </div>
    );
  }
});

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 CommentBox = React.createClass({
  getInitialState: function() {
    return {data: []};
  },
  componentWillMount: function() {
    var xhr = new XMLHttpRequest();
    xhr.open('get', this.props.url, true);
    xhr.onload = function() {
      var data = JSON.parse(xhr.responseText);
      this.setState({ data: data });
    }.bind(this);
    xhr.send();
  },
  render: function() {
    return (
      <div className="commentBox">
        <h1>Comments</h1>

        <CommentList data={this.state.data} />

        <CommentForm />
      </div>
    );
  }
});

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

这个错误也可能发生，因为您试图嵌入一个 react 组件，就好像它是一个渲染结果，而不是一个组件本身。

例如

var SampleClass = React.createClass({
...
});

然后你尝试像这样使用它

<div>
  {SampleClass}
</div>

事实上，你应该做这样的事情

<div>
  <SampleClass/>
</div>

我收到了类似的错误，“无法读取未定义的属性 'ref'”，这就是问题所在。