進(jìn)度條( ProgressBar )組件提供了對顯示長時間操作的進(jìn)度反饋。進(jìn)度值隨著時間的變化而變化以讓用戶了解當(dāng)前的正在執(zhí)行的操作進(jìn)度。
名稱 | 數(shù)據(jù)類型 | 作用描述 | 默認(rèn)值 |
---|---|---|---|
value | number | 百分比進(jìn)度值。 | 0 |
showValue | boolean | 是否顯示進(jìn)度值。 | false |
barCls | string | 進(jìn)度條的樣式類。 | null |
barStyle | Object | 進(jìn)度條的內(nèi)聯(lián)樣式。 | null |
注:
- 繼承: None 。
進(jìn)度條( ProgressBar )的創(chuàng)建十分簡單,僅需要以 HTML 標(biāo)記創(chuàng)建即可。
<div>
<ProgressBar>進(jìn)度條( ProgressBar )</ProgressBar>
</div>
<div style="margin-bottom:20px">
<ProgressBar :value="40" ;showValue="true"></ProgressBar>
</div>
<div style="margin-bottom:20px">
<ProgressBar :value="70" :showValue="false">Processing 70%</ProgressBar>
</div>
<div style="margin-bottom:20px">
<div style="text-align:right">50%</div>
<ProgressBar :value="50" :showValue="false" barCls="c6" style="height:4px"></ProgressBar>
</div>
注:
- 請您參考屬性列表,仔細(xì)核對示例中的屬性設(shè)置以更好的了解進(jìn)度條( ProgressBar )組件的使用方法。
更多建議: