我的代码需要分页算法帮助吗？答案

【问题标题】：I need a pagination algorithm help for my code?我的代码需要分页算法帮助吗？
【发布时间】：2017-11-21 00:29:34
【问题描述】：

我的页面和 pageSize 由组件作为回调提供，这是我的代码：

renderTodos(page=0, pageSize=3) {

 if(page) {
    this.setState({
      current: page,
      page: page
    })
  }
   var f = this.state.page*2;
  var x = this.state.page*2;
  console.log("page ", f)
  console.log("page ", x+1)

    return this.props.todos.slice(f,x+1).map((todo,todoIndex) => {
      return <Todo
        key={todo.id}
        {...todo} // pass all the todo property
        onClick={() => onTodoClick(todo.id)}
        onTrashClick={() => onDeleteClick(todo.id, todoIndex)}
        handleSelectedTodo = {this._handleSelectedTodo}
        isChecked={this.state.checkedIds.includes(todo.id)}
      />
   })
}

我的问题是我在选择正确的索引时遇到问题，假设我在第 2 页（与 pageSize 一起在回调中提供）我想选择第 4 到第 6 个索引，因为我的 pageSize 为 3，当我在第三个索引我想选择第 7 到第 9 个索引等等，但我不知道要使用什么算法。帮忙？

【问题讨论】：

标签： javascript algorithm reactjs pagination

【解决方案1】：

这个怎么样？

renderTodos(page=0, pageSize=3
{ 
     if(page) { 
         this.setState({ current: page, page: page }) 
     } 
     var f = page * pageSize;
     var l = f + pageSize;
     return this.props.todos.slice(f, l).map((todo,todoIndex) => { 
         return <Todo key={todo.id} {...todo} // pass all the todo property
         onClick={() => onTodoClick(todo.id)} 
         onTrashClick={() => onDeleteClick(todo.id, todoIndex)
         handleSelectedTodo = {this._handleSelectedTodo
         isChecked={this.state.checkedIds.includes(todo.id)} /> 
     })
}

对于第 1 页，pageSize 3：索引从 3（第 4 个元素）开始，切片的结束索引为 3+3=6。所以 slice 会返回索引为 3, 4, 5 (4th, 5th n 6th)的元素

【讨论】：