reactjsdynamicpaginationreact-bootstrapreact-bootstrap-table

how to load data in react-bootstrap-table partially by using pagination

I am getting data partially from backend (let's say 10 rows per api call) and I want to call the api on page change but I am unable to find any relevant option in react-bootstrap-table pagination. Is there any solution to this problem?

Solution

  • "react-bootstrap-table2-paginator" takes a prop of onPageChange where you can do what you want with the page number https://codesandbox.io/s/react-bootstrap-table-paging-example-forked-rqhyd5

      <BootstrapTable
        bootstrap4
        keyField="id"
        data={products}
        columns={columns}
        pagination={paginationFactory({ sizePerPage: 5, onPageChange:(page)=>console.log("DB CALL with page" + page) })}
      
      />