我需要一个分页算法帮助我的代码？

Question

我的网页和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，而当我在第3个索引时，我想选择第7到第9个索引等等，但我无法弄清楚使用什么算法。帮帮我？

Answer 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（第四元件）和切片结束索引是3 + 3 = 6。所以slice会返回索引3,4,5（第四，第五，第六）的元素