Pagination est un outil utilisé pour naviguer à travers un contenu étendu sur plusieurs pages. Généralement placé en bas de page, il offre des liens pour se déplacer entre les pages suivantes, précédentes, numérotées et parfois la première ou la dernière, rendant ainsi les grands ensembles de contenu plus accessibles et gérables, améliorant ainsi l’expérience utilisateur et l'utilisation.
Installation
Suivez les étapes ci-dessous pour installer et utiliser le composant ip-pagination dans votre projet.
Étape 1
Installez le composant ip-pagination en tant que dépendance dans votre projet :
npm install ip-accordion
Étape 2
Importez le module dans votre fichier script :
Utilisation
Pour utiliser ce composant, ajoutez les propriétés sous forme d’attributs.
Propriétés
| Propriété | Attribut | Nécessité | Description | Type | Valeur par défaut |
|---|
| totalPages | total-pages | Requise | Le nombre total de pages. | Nombre | 10 |
| currentPage | current-page | Optionnel | La page active actuelle. | Nombre | 1 |
| visiblePages | visible-pages | Optionnel | Le nombre de pages visibles dans la pagination. | Nombre | 5 |
Personnalisation
Nous disposons d’un ensemble de variables prédéfinies permettant de personnaliser la pagination :
--pagination-button-color--pagination-button-background--pagination-button-border-radius--pagination-button-padding--pagination-button-active-background--pagination-button-disabled-color
Pour mettre à jour ces valeurs, utilisez le CSS suivant :
Écoute des événements
Pour écouter l’événement émis par ce composant, un événement pageChanged a été défini.
L’événement pageChanged est déclenché lorsque la page actuelle change. Vous pouvez écouter cet événement afin de gérer les changements de page.
