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