mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-25 03:29:59 +08:00
Code Issues Actions 35 Packages Projects Releases Wiki Activity
a998569adb
ant-design/components/statistic/index.zh-CN.md
MadCcc 34af3ec550
feat: component token rename (#42184) 
* feat: component token naming rules

* dcos: update

* feat: modal token rename

* feat: rename result token

* feat: statsitic token rename

* feat: steps token remane

* chore: update snapshot

* chore: fix lint

* feat: semantic part component

* revert: button & notification

* revert: files

* chore: code clean
2023-05-09 19:24:50 +08:00

2.6 KiB
Raw Blame History

category subtitle group title cover coverDark demo
Components 统计数值 数据展示 Statistic https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*YL7PRYNtH-4AAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*BPWDRbSYxJ4AAAAAAAAAAAAADrJ8AQ/original
cols
2

展示统计数值。

何时使用

  • 当需要突出某个或某组数字时。
  • 当需要展示带描述的统计类数据时使用。

代码演示

基本 单位 动画效果 在卡片中使用 倒计时 组件 Token

API

Statistic

参数 说明 类型 默认值 版本
decimalSeparator 设置小数点 string .
formatter 自定义数值展示 (value) => ReactNode -
groupSeparator 设置千分位标识符 string ,
loading 数值是否加载中 boolean false 4.8.0
precision 数值精度 number -
prefix 设置数值的前缀 ReactNode -
suffix 设置数值的后缀 ReactNode -
title 数值的标题 ReactNode -
value 数值内容 string | number -
valueStyle 设置数值区域的样式 CSSProperties -

Statistic.Countdown

参数 说明 类型 默认值 版本
format 格式化倒计时展示，参考 dayjs string HH:mm:ss
prefix 设置数值的前缀 ReactNode -
suffix 设置数值的后缀 ReactNode -
title 数值的标题 ReactNode -
value 数值内容 number | dayjs -
valueStyle 设置数值区域的样式 CSSProperties -
onFinish 倒计时完成时触发 () => void -
onChange 倒计时时间变化时触发 (value: number) => void - 4.16.0

Design Token