Javascript React教程：未捕获类型错误：无法读取属性'；数据'；空的

我将在以下网站上阅读React教程：

我只是在之后

我在SO上也遇到过类似的问题，但没有为我的具体案例找到解决方案

var data = [
    {author: "Pete Hunt", text: "This is one comment"},
    {author: "Jordan Walke", text: "This is *another* comment"},
    {author: "Bob Lilly", text: "This is *another* comment 2"}

];

var Comment = React.createClass({
    render: function() {
        var rawMarkup = marked(this.props.children.toString(), {sanitize: true});
        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">
                <br/>Hello, world! I am a CommentForm.
            </div>
        );
    }
});

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


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

var数据=[
{作者：“皮特·亨特”，正文：“这是一条评论”}，
{作者：“Jordan Walke”，正文：“这是另一条评论”}，
{作者：“鲍勃·莉莉”，文字：“这是另一条评论2”}
];
var Comment=React.createClass({
render:function（）{
var rawMarkup=marked（this.props.children.toString（），{sanitize:true}）；
返回(
{this.props.author}
);
}
});
var CommentList=React.createClass({
render:function（）{
var commentNodes=this.props.data.map（函数（注释）{
返回(
{comment.text}
);
});
返回(
{commentNodes}
);
}
});
var CommentForm=React.createClass({
render:function（）{
返回(

你好，世界！我是一个评论人。
);
}
});
var CommentBox=React.createClass({
render:function（）{
返回(
评论
);
}
});
反应(
// , 
,
document.getElementById（'content'）
);

当我尝试使用从服务器获取的数据时（第一步-->请参阅第二个链接），出现以下错误：

未捕获的TypeError:无法读取null的属性“数据”

我想这与错误地传递数据有关

编辑：我用目前给出的答案编辑了cod

---

编辑2：现在它可以处理哑数据（var data=[…）但当从服务器获取数据时，您将通过道具将

数据

发送到

评论框

，并在

评论列表

组件中检查数据

您将

数据

作为道具发送到

评论框

并尝试通过

评论框

状态传递数据

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

而不是

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

---

我通常是这样思考道具的：道具是即将进入的东西，状态是已经进入的东西。

仅仅添加这一行不会从服务器获取数据。您需要一直工作到“反应状态”部分的末尾，创建数据文件，并添加一些ajax代码来加载数据。

实际上这是一个输入错误（不知道为什么）。无论如何，在CommentList的render:function（）中，我尝试了console.log（this.props）；它打印对象{data:undefined}，但错误仍然存在。我设法使它可以处理哑数据，但不能处理服务器数据。查看我的编辑我不明白。你能更精确一点吗？（请同时查看我的编辑）我设法使它可以处理哑数据，但不能处理服务器数据。请参阅我的编辑