在ReactJs中实现“显示更多”

Question

我正在尝试为Reactjs中的评论部分实现“显示更多”功能，但是当我点击显示更多时，它不会加载整个数组，但它会删除显示更多链接。这是我的代码：

var CommentBox = React.createClass({
getInitialState: function() {
return {limit:3 ,showMore:false};
},
showMore:function() {
  this.setState({showMore: true, limit: this.props.comments.length});
},
render: function() {
  var cls=[];
  var length=this.props.comments.length;

  if(length >= this.state.limit){
      cls=[];
      for (var i=0;i<this.state.limit;i++ )
          cls.push(this.props.comments[i]);
  }
      return (
    <div className="commentBox">
        <CommentList data={cls} />

        {length> 3 &&!this.state.showMore? <div><a onClick={this.showMore}  >show more</a></div>: null}
    </div>
);
 }
});

对state.comments进行任何更改都不会影响视图。

Answer 1

这有效：http://jsbin.com/ceqisepewu/edit?js,console,output

将它与您的解决方案进行比较，找出它无效的原因。