COMPONENTS
Pagination
Pagination is a tool used to navigate through extended content on multiple pages. Generally placed at the bottom of the page, it offers links to move between the following, previous, numbered and sometimes the first or last pages, thus making large sets of content more accessible and manageable, improving user experience and use.
Demo
Code
Documentation
Installation
Follow these steps to install and use the le composant ip-pagination dans votre projet.
Step 1
Install the ip-pagination component as a dependency in your project:
npm install ip-accordionStep 2
Import the module into your script file:
Usage
To use this component, add the properties as attributes.
Properties
| Property | Attribute | Necessity | Description | Type | Default |
|---|---|---|---|---|---|
| totalPages | total-pages | Required | The total number of pages. | number | 10 |
| currentPage | current-page | Optional | The current active page. | number | 1 |
| visiblePages | visible-pages | Optional | The number of pages to display in the pagination controls. | number | 5 |
Customization
We have a set of predefined variables used to customize the pagination:
--pagination-button-color--pagination-button-background--pagination-button-border-radius--pagination-button-padding--pagination-button-active-background--pagination-button-disabled-color
To update the values, use the following CSS:
Event listening
To listen this event emitted,we have definied pageChanged event in this component.
The pageChanged event is fired when the current page changes. You can listen to this event to handle page changes.