React EasyUI 進(jìn)度條

2020-06-24 11:59 更新

進(jìn)度條( ProgressBar )組件提供了對顯示長時(shí)間操作的進(jìn)度反饋。進(jìn)度值隨著時(shí)間的變化而變化以讓用戶了解當(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

注:
- 繼承: LocaleBase 。

使用方法

  • 創(chuàng)建進(jìn)度條( ProgressBar ),并設(shè)置value值。

<div style={{ marginBottom: 20 }}>
  <ProgressBar value={40} showValue></ProgressBar>
</div>
<div style={{ marginBottom: 20 }}>
  <ProgressBar value={70}></ProgressBar>
</div>
<div style={{ marginBottom: 20 }}>
  <div style={{ textAlign: 'right' }}>50%</div>
  <ProgressBar value={50} barCls="c6" style={{ height: 4 }}></ProgressBar>
</div>

  • 參考圖例:

ProgressBar

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號