How to start with page number 1 instead of 0 ?

[eromoe]

Hi,

I found this project use 0 as start page number, but I need 1. Looks like there is no such parameter to adjust this ? Now , have to use hrefBuilder.

[mundosk8]

disableInitialCallback={ true }
initialPage={ 1 }

[eromoe]

initialPage={1}

Just tell react-paginate current page is 1, but actually select 2

[AdeleD]

By default the initial page selected is 1. Which version of react-paginate do you use?

[eromoe]

react-paginate is latest.

I think you misunderstand. I have said react-paginate use 0 as start page number , that may be confused , see below

The key point is

tabindex="0"

react-paginate think api is start from 0, But my api is start from page 1 .

When it is in first page, I add page=1 to current url querystring, which make react-paginate show current page 2 .

[sergioviniciuss]

same issue here.. did u find a solution?

[sergioviniciuss]

@AdeleD actually, the behavior I see is the same reported by @eromoe .. the react-paginate thinks api start from 0

[eromoe]

I don't have much time to make a PR, so simply switch to another plugin .

[joseph-engelmajer]

Running into the same issue. I assume it has something to do with mapping over an array of pages and using their index. I went into the module and +1d all the indexes to no avail. :(

[joseph-engelmajer]

changed the pagination on my api lol

[oldtinroof]

I just came across the same issue, and worked it out as follows:

forcePage={pagination.currentPage - 1} on the ReactPaginate call. Did not include the initialPage prop.

requestData.page = selected + 1; in my onPageChange handler.

Seems to work fine now :)

[ikashifullah]

@AdeleD I think this is a very serious problem.

Could you please help us with this?

[ikashifullah]

@eromoe, could you please tell which plugin did you move to?

[AdeleD]

I’m currently working on a solution. I’ll let you know when it’s done

[ikashifullah]

Hi @AdeleD,

Any progress so far? We really need this fix quickly.

Thank you.

[mustapha-ghlissi]

Hi guys ,

is this issue fixed now ?

It's urgent !!!

Thanks

[WarrenBuffering]

Hey @MustaphaGhlissi, not fixed per se, but I did find a workaround of sorts. Since they're assuming a zero index, you'll have to increment 'e.selected' by one on click to dispatch your paginated fetch properly.

Additionally, if you're having issues with the pagination tracking your current page, you can set the property forcePage={currentPage - 1} to re-align your state's currentPage with their zero index.

Tracking your current page in state.....

    state = {
        currentPage: 1
    }

In your onPageChangeHandler...

    _handlePageChange = (e) => {
        const nextPage = e.selected + 1

        dispatchAction( nextPage, pageSize,  /* ...any additional args */ )
        this.setState({ currentPage: nextPage })
    }

In your ReactPaginate component...

render() {
    return (
        
        /* whatever you're rendering */

        <ReactPaginate
            onPageChange={this._onPageChange}
            pageCount={totalPages}
            forcePage={currentPage -1} 
        />
    )
}

[cacoze]

+1 For this issue. I would appreciate a builtin support for zero index pagination

[malbayoush]

Hi, Fixed as below : @observable page = 1; And when you call the API set : .list( this.axiosParams, LIMIT, this.page - 1 );

[sampahgit]

initialPage={1}

Just tell react-paginate current page is 1, but actually select 2

[sampahgit]

• const [page, setPage] = useState(1);

  const changePage = ({ selected }) => { setPage(selected + 1); };

<ReactPaginate initialPage={0} onPageChange={changePage} />