Qu'est-ce que bootstrap-vue

Bootstrap-Vue est une bibliothèque de composants d'interface utilisateur qui suit la méthode de développement de composants de Vue, utilise les styles Bootstrap pour contrôler l'apparence des composants et abandonne la dépendance à l'égard de jquery. Continuons à profiter de la commodité des styles d'amorçage tout en utilisant Vue.js.

Cet article tente de tester chaque composant afin de minimiser les interférences provenant d'autres facteurs, la méthode d'accès au cdn est toujours utilisée. Si vous aimez utiliser des outils de packaging modulaires, tels que webpack, le site officiel propose une documentation détaillée à titre de référence.

1. Alertes (boîte d'avertissement) : le scénario d'utilisation principal est de donner un retour sur le comportement de l'utilisateur.

Remarque :

Vous devez toujours utiliser l'attribut show pour contrôler la visibilité d'un composant.

Ajoutez l'attribut rejetable au composant pour afficher un bouton de fermeture. Il doit toujours être utilisé avec l'événement rejeté, l'état des données de l'attribut d'affichage d'alerte est réinitialisé dans la machine virtuelle

peut être transmis L'attribut variant (primaire, secondaire, succès, danger, avertissement, info) génère des alertes avec une sémantique différente

L'attribut dismiss-count-down accepte une fonction qui peut nous aider à implémenter un alerte d'arrêt automatique programmé

2. Badge : permet d'ajouter des informations supplémentaires à certains contenus.

Remarque :

Le badge ajustera sa taille de police en fonction de la taille de police de l'élément parent direct, qui utilise des unités em.

Le style sémantique du badge peut être défini grâce à l'attribut variant. (par défaut, primaire, succès, avertissement, info, danger)

Ajouter l'attribut pilule pour définir un badge de style capsule (coins arrondis améliorés)

Vous pouvez ajouter des comportements au badge via le Attribut href (ignorer le transfert)

Si vous avez besoin d'un badge circulaire, reportez-vous au badge circulaire implémenté en CSS

3. Fil d'Ariane : affiche le chemin de navigation de la page actuelle et indique. nous où nous en sommes actuellement Position

Remarque : Le délimiteur du chemin

est automatiquement ajouté par css en précisant l'attribut content du pseudo élément :: avant.

les éléments sont chaque élément de navigation sur le chemin, spécifié via un tableau d'objets. Vous pouvez attribuer l'attribut actif à un objet pour le mettre dans l'état actif

Si aucun élément n'est explicitement spécifié comme état actif, le dernier élément sera considéré comme l'état actif par défaut.

Spécifier les attributs href ou to pour les éléments de navigation peut ajouter un comportement de navigation.

4. Bouton : un élément de contrôle de base utilisé pour déclencher des comportements.

Remarque :

Le style sémantique du bouton peut être défini via l'attribut variant. (par défaut, primaire, succès, avertissement, info, danger)

Définissez la taille du bouton (sm, lg) via l'attribut size S'il n'est pas spécifié, il y aura un style par défaut.

Vous pouvez toujours utiliser l'attribut type (soumettre, réinitialiser, bouton).

Ajouter le statut désactivé via désactivé.

L'ajout de href ou d'attributs générera une balise de style bouton.

Ajoutez l'attribut enfoncé pour contrôler si le bouton est cliqué. Utilisez le modificateur de synchronisation pour synchroniser l'état du bouton avec les données de la machine virtuelle.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!