Search code examples
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) })}
          
          />