我需要一個分頁算法幫助我的代碼？

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（第四，第五，第六）的元素