ant-design/components/statistic/index.en-US.md
二货爱吃白萝卜 20561d6f9d
docs: Fix component doc alignment & support import usage (#48004)
* docs: init ref

* docs all support

* docs: fix link show
2024-03-22 14:22:42 +08:00

2.7 KiB
Raw Permalink Blame History

category group title description cover coverDark demo
Components Data Display Statistic Display statistic number. 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

When To Use

  • When want to highlight some data.
  • When want to display statistic data with description.

Examples

Basic Unit Animated number In Card Countdown Component Token

API

Common props refCommon props

Statistic

Property Description Type Default Version
decimalSeparator The decimal separator string .
formatter Customize value display logic (value) => ReactNode -
groupSeparator Group separator string ,
loading Loading status of Statistic boolean false 4.8.0
precision The precision of input value number -
prefix The prefix node of value ReactNode -
suffix The suffix node of value ReactNode -
title Display title ReactNode -
value Display value string | number -
valueStyle Set value section style CSSProperties -

Statistic.Countdown

Property Description Type Default Version
format Format as dayjs string HH:mm:ss
prefix The prefix node of value ReactNode -
suffix The suffix node of value ReactNode -
title Display title ReactNode -
value Set target countdown time number -
valueStyle Set value section style CSSProperties -
onFinish Trigger when time's up () => void -
onChange Trigger when time's changing (value: number) => void - 4.16.0

Design Token