Vuetify

Boutique

Entreprises

The v-progress-linear component is used to convey data visually to users. They can also represent an indeterminate amount, such as loading or processing.

In its simplest form, v-progress-linear displays a horizontal progress bar. Use the value prop to control the progress.

Sélectionnez le composant désiré ci-dessous afin de voir les props, slots, événements et méthodes disponibles.

Vous trouverez ci-dessous une collection d'exemples simples ou complexes.

The progress linear component can have a determinate state modified by v-model.

Utiliser le propindeterminate, v-progress-linear anime en permanence.

A buffer state represents two values simultaneously. The primary value is controlled by v-model, whereas the buffer is controlled by the buffer-value prop.

The query state is controlled by the truthiness of indeterminate, while the query prop set to true.

Vous pouvez également définir la couleur en utilisant les props color et background-color.

Le proprounded est un style alternatif qui ajoute un rayon de bordure au composant v-progress-linear.

La propriété stream fonctionne avec buffer-value pour transmettre à l'utilisateur qu'il y a une action en cours. Vous pouvez utiliser toute combinaison de buffer-value et value pour réaliser votre conception.

This applies a striped background over the value portion of the v-progress-linear.

Displays reversed progress (right to left in LTR mode and left to right in RTL).

En utilisant la propabsolu nous sommes en mesure de positionner le composant v-progress-linear au bas de la v-toolbar. Nous utilisons également la propactif qui nous permet de contrôler la visibilité du progrès.

Le composant v-progress-linear est bon pour traduire à l'utilisateur qu'il attend une réponse.

The v-progress-linear component will be responsive to user input when using v-model. You can use the default slot or bind a local model to display inside of the progress. If you are looking for advanced features on a linear type component, check out v-slider.

Prêt pour plus ? Continuez la lecture avec :

Caught a mistake or want to contribute to the documentation? Edit Layout on GitHub!