Я следую учебному курсу reactjs, и я продолжаю сталкиваться с проблемой при передаче значения из состояния одного компонента в другой компонент. Ошибка 'Невозможно прочитать свойство' map 'из undefined' вызывается при выполнении функции map в компоненте CommentList. Что может заставить prop стать undefined при переходе из CommentBox в CommentList?
var CommentList = React.createClass({
render: function() {
var commentNodes = this.props.data.map(function (comment){
return (
<div>
<h1>{comment.author} </h1>
</div>
);
});
return (
<div className="commentList">
{commentNodes}
</div>
);
}
});
var CommentBox = React.createClass({
getInitialState: function(){
return {data: []};
},
getComments: function(){
$.ajax({
url: this.props.url,
dataType: 'json',
success: function(data){
this.setState({data: data});
}.bind(this),
error: function(xhr, status, err){
console.error(url, status, err.toString());
}.bind(this)
});
},
componentWillMount: function(){
this.getComments()
},
render: function(){
return (
<div className="commentBox">
{/*this.state.data.comments*/}
{<CommentList data={this.state.data.comments}/>}
</div>
);
}
});
React.renderComponent(
<CommentBox url="comments.json" />,
document.getElementById('content')
);