state updates, props not?

gistfile1.js

/** @jsx React.DOM */
var CommentBox = React.createClass({
 loadCommentsFromServer: function() {
    $.ajax({
      url: '/data/',
      dataType: 'json',
      success: function(data) {
        this.setState({commentData: data});
      }.bind(this),
      error: function(xhr, status, err) {
        console.error(this.props, status, err.toString());
      }.bind(this)
    });
  },
  componentDidMount: function() {
    this.loadCommentsFromServer();
    setInterval(this.loadCommentsFromServer, 5000);
  },
  render: function() {
    return (
      <div className="commentBox">
        <h1>Comments</h1>
        <CommentList data={this.props.commentData} />
      </div>
    );
  }
});

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

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

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

comment_data is taken from the react tutorial... basically:

comment_data = [
{'id': 1, 'author': "Pete Hunt", 'text': "This is one comment asdasd"},
{'id': 2, 'author': "Jordan Walke", 'text': "This is another comment"}
]