onClick正在开火

我有以下reactJs组件:

var Pagination = React.createClass({

  // Basic pagination
  render: function() {
    // Do we have more then one page?
    if (this.props.maxPages > 0){
      var pageLink = this.props.maxPages;
      var liElements = []

      for (var i = 1; i <= pageLink; i++) {
          liElements.push(
{i}
);
      }

      return (
{liElements}
);
    }else{
      // Return nothing.
      return ( 
 );
    }
  }

});

每个li元素都有一个链接元素,每个元素都有一个onClick=...属性.传入的函数位于骨干视图中,并且其中包含console.log(id).当页面加载时,如果页面上有两个li,你可以将i变量吐出两次.如果单击其中一个li元素,也会发生这种情况.

我的问题是 - 当我为x个li元素加载页面时,为什么onClick会触发？为什么当我点击一个li元素时它会i为每个li元素吐出变量？

该handlePaginate函数看起来像

handlePaginate: function(id) {
  console.log(id); //=> 1,2 (for two li elements with id's of 1 and 2)
  return false; //=> doesn't actually stop the page from refreshing oO
}

user3379926.. 6

事实证明,解决这个问题的方法是:

onClick = {this.props.handlePaginate.bind(this, i)}

在链接值中,这将停止分页事件的触发,并在单击li元素时停止刷新页面.