React.js官网的评论列表

container--------------commentBox    评论列表----commentList        评论内容---comment        评论内容---comment    评论列表----    写评论的组件---commentFormcontainer--------------1.获取评论数据（1）在服务端写mock模拟数据--取得API接口的URL地址（2）在对应函数内写ajax请求,在success中this.setState({data:result.*})不要忘记  getInitialState: function() {    return {data: []};  },（3）在评论组件中循环遍历data<CommentList data={this.state.data} />var CommentList = React.createClass({  render: function() {    var commentNodes = this.props.data.map(function(comment) {      return (        <Comment author={comment.author} key={comment.id}>          {comment.text}        </Comment>      );    });    return (      <div className="commentList">        {commentNodes}      </div>    );  }});2.添加评论（1）给每一个输入框，下拉框，分页等设置 onChange={this.*}  getInitialState: function() {    return {author: '', text: ''};  },（2） handleTextChange（e）{    handleTextChange就是*   对应输入框等的改变事件 this.setState({text: e.target.value});}（3）在提交表单的事件中判断数据是否为空，数据的长度同时将输入框的数据清空  handleSubmit: function(e) {    对应form组件的提交事件    e.preventDefault();    var author = this.state.author.trim();    var text = this.state.text.trim();    if (!text || !author) {      return;    }    // TODO: send request to the server    this.setState({author: '', text: ''});  },（4）通过ajax请求发送数据最顶层---------------  handleCommentSubmit: function(comment) {    $.ajax({      url: this.props.url,      dataType: 'json',      type: 'POST',      data: comment,      success: function(data) {        this.setState({data: data});      }.bind(this),      error: function(xhr, status, err) {        console.error(this.props.url, status, err.toString());      }.bind(this)    });  },<CommentForm onCommentSubmit={this.handleCommentSubmit} />在CommentForm组件内------------ this.props.onCommentSubmit({author: author, text: text});