Progress 进度条

用于展示操作的当前进度。

基础用法

import { Progress } from '@airo-ui/react'

function Demo() {
  return <Progress percent={60} />
}

自定义颜色

import { Progress } from '@airo-ui/react'

function Demo() {
  return (
    <>
      <Progress percent={30} color="#E85D3A" />
      <Progress percent={60} color="#52C41A" />
      <Progress percent={90} color="#1890FF" />
    </>
  )
}

尺寸

import { Progress } from '@airo-ui/react'

function Demo() {
  return (
    <>
      <Progress percent={60} size="sm" />
      <Progress percent={60} size="md" />
      <Progress percent={60} size="lg" />
    </>
  )
}

隐藏百分比

import { Progress } from '@airo-ui/react'

function Demo() {
  return <Progress percent={60} showInfo={false} />
}

API

Props

名称	类型	默认值	说明
percent	number	0	当前进度百分比（0-100）
size	'sm' | 'md' | 'lg'	'md'	尺寸
color	string	—	进度条颜色
showInfo	boolean	true	是否显示百分比文字