プログレスバーは、処理状況を示すインジケーターです。
import { ProgressBar } from 'primereact/progressbar';
プログレスバーは、valueプロパティと共に使用されます。
<ProgressBar value={50}></ProgressBar>
値はリアクティブであるため、動的に更新するとバーも変化します。
<ProgressBar value={value}></ProgressBar>
プログレスバー内のカスタムコンテンツは、displayValueTemplateプロパティで定義します。
<ProgressBar value={40} displayValueTemplate={valueTemplate}></ProgressBar>
値を追跡する必要のない進捗状況の場合は、modeプロパティをindeterminateに設定します。
<ProgressBar mode="indeterminate" style={{ height: '6px' }}></ProgressBar>
プログレスバーコンポーネントは、aria-valuemin、aria-valuemax、aria-valuenow属性と共にprogressbarロールを使用します。コンポーネントを説明する値は、aria-labelledbyおよびaria-labelプロップを使用して定義できます。
<span id="label_status">Status</span>
<ProgressBar aria-labelledby="label_status" />
<ProgressBar aria-label="Status" />
該当なし。