Using react-js-pagination for pagination but bootstrap style not getting applied

Question

I am using react-js-pagination for displaying page numbers in application. Bootstrap is added in the public/index.html file and is accessible using className in other components.

For Pagination component do I need to add the bootstrap style explicitly? All the examples I have seen are having the style automatically applied.

Code-

import Pagination from "react-js-pagination";
<Pagination
        activePage={this.state.activePage}
        itemsCountPerPage={3}
        totalItemsCount={450}
        pageRangeDisplayed={3}
        onChange={this.handlePageChange}
      />

Answer 1

from react-js-pagination documentation:

If you would like it to work for Bootstrap 4, you will need to add 2 additional props when using this component:
linkClass="page-link" itemClass="page-item"

so you just need to do this:

<Pagination
    itemClass="page-item"
    linkClass="page-link"
    activePage={this.state.activePage}
    itemsCountPerPage={3}
    totalItemsCount={450}
    pageRangeDisplayed={3}
    onChange={this.handlePageChange}
/>

Answer 2

Looks as if react-js-pagination is using bootstrap v3, you can do the following

1. Install bootstrap v3 using npm (npm install bootstrap@3 --save) or
2. Include the cdn link in public/index.html file

Bootstrap v3 CDN