eo-statistics-card
<eo-statistics-card>统计卡片
Examples
Basic
Outline
Size
Overview card
Complex usage
Interaction
Operator slot
Whole card
Properties
| Name | Description | Type | Default | Required |
|---|---|---|---|---|
cardTitle | 卡片标题 | string | ||
value | 值 | string | ||
unit | 单位 | string | ||
icon | 图标 | EoStatisticsCardProps["icon"] | ||
size | 尺寸 | "large" | "medium" | "small" | "medium" | |
outline | 卡片轮廓 | "border" | "background" | "none" | "border" | |
background | 背景 | string | ||
descriptionPosition | 描述位置 | "bottom" | "right" | "bottom" | |
valueStyle | 值样式 | React.CSSProperties | ||
interactable | 是否可互动 | boolean |
Slots
| Name | Description |
|---|---|
titlePrefix | 标题前缀，放置辅助信息 |
titleSuffix | 标题前缀，放置辅助信息 |
description | 描述信息，通常是对于统计值的描述 |
basicContent | 卡片右侧内容区，适合放置迷你图表，常用于小卡片 |
extraContent | 卡片下方内容区，适合放置图表，用于展示更多信息的场景 |
operator | 右上角操作区 |
Type references
EoStatisticsCardProps
| Name | Type | Required | Description |
|---|---|---|---|
cardTitle | string | ||
value | string | ||
unit | string | ||
icon | GeneralIconProps & { color?: string; bgColor?: string } | ||
size | "large" | "medium" | "small" | ||
outline | "border" | "background" | "none" | ||
background | string | ||
descriptionPosition | "bottom" | "right" | ||
valueStyle | React.CSSProperties | ||
interactable | boolean |