Statistic
Statistic
Display statistic number.
Importimport { Statistic } from "antd"; |
Sourcecomponents/statistic |
- Components Overview
- General
- Layout
- Navigation
- Data Entry
- Data Display
- Feedback
- Other
Common props ref：Common props
| 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 | - |
| 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 |
| Property | Description | Type | Default | Version |
|---|---|---|---|---|
| type | time counter down or up | countdown countup | - | |
| 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, only to be called when type is countdown | () => void | - | |
| onChange | Trigger when time's changing | (value: number) => void | - |
| Token Name | Description | Type | Default Value |
|---|---|---|---|
| contentFontSize | Content font size | number | 24 |
| titleFontSize | Title font size | number | 14 |
Simplest Usage.
Animated number with react-countup.
Timer component.
Add unit through prefix and suffix.
Display statistic data in Card.
