最も単純な形式では、 v-progress-linearは水平のプログレスバー(進捗状況)を表示します。進捗を制御するには、 valueプロパティを使用します。

確認したいコンポーネントを下から選び、利用できる props、slots、events、functions を確認してください。


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

Using the indeterminate prop, v-progress-linear continuously animates.

バッファ状態は、2つの値を同時に表します。プライマリ値はv-modelによって制御されますが、バッファはbuffer-value propによって制御されます。

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


The rounded prop is an alternative style that adds a border radius to the v-progress-linear component.

The stream property works with buffer-value to convey to the user that there is some action taking place. You can use any combination of buffer-value and value to achieve your design.


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

Using the absolute prop we are able to position the v-progress-linear component at the bottom of the v-toolbar. We also use the active prop which allows us to control the visibility of the progress.


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.

準備はいいですか? 以下から続きが読めます。

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