进度栏

在本文中

一个简单的水平进度条组件。

支持两种模式:确定性和不确定性。进度条在指定了特定的进度值(从0到100)时是确定的,而在未指定值时是不确定的。

用法

基本用法:

从“@wordpress/components”导入{ProgressBar};const MyLoadingComponent=()=>{return<ProgressBar/>;};

您还可以通过传递价值(从0到100)表示进度:

从“@wordpress/components”导入{ProgressBar};const MyLoadingComponent=({progress})=>{return<ProgressBar value={progress}/>;};

您可以通过将自定义CSS类名传递给来自定义它的外观类名.

.my-custom-progress-bar{宽度:100%;}
从“@wordpress/components”导入{ProgressBar};const MyLoadingComponent=()=>{return<ProgressBar className=“my-custom-progress-bar”/>;};

道具

组件接受以下道具:

价值:

进度值,一个从0到100的数字。
如果价值未指定,则进度条将被视为不确定。

  • 必需:否

类名:一串

要应用于底层的CSS类div公司元素,用作进度条轨迹。

  • 必需:否

继承的道具

任何额外的道具都将传递给基础<进度/>元素。