ant-design/components/avatar/index.en-US.md
Wanpan 8875ca7043
feat: Avatar.Group adding max props (#49131)
* feat: Avatar.Group adding max props

* feat: update

* feat: update

* feat: update test case

* feat: update docs

* Update components/avatar/index.en-US.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: Wanpan <wanpan96@163.com>

* feat: update docs

* feat: update

* feat: update snap

* feat: delete default value

---------

Signed-off-by: Wanpan <wanpan96@163.com>
Co-authored-by: afc163 <afc163@gmail.com>
2024-06-01 14:44:53 +08:00

2.8 KiB
Raw Permalink Blame History

category title description cover coverDark demo group
Components Avatar Used to represent users or things, supporting the display of images, icons, or characters. https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*JJBSS5lBG4IAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*YbgyQaRGz-UAAAAAAAAAAAAADrJ8AQ/original
cols
2
title order
Data Display 5

Examples

Basic Type Autoset Font Size With Badge Avatar.Group Calculate text style when hiding Responsive Size Fallback Component Token

API

Common props refCommon props

Avatar

Property Description Type Default Version
alt This attribute defines the alternative text describing the image string -
gap Letter type unit distance between left and right sides number 4 4.3.0
icon Custom icon type for an icon avatar ReactNode -
shape The shape of avatar circle | square circle
size The size of the avatar number | large | small | default | { xs: number, sm: number, ...} default 4.7.0
src The address of the image for an image avatar or image element string | ReactNode - ReactNode: 4.8.0
srcSet A list of sources to use for different screen resolutions string -
draggable Whether the picture is allowed to be dragged boolean | 'true' | 'false' true
crossOrigin CORS settings attributes 'anonymous' | 'use-credentials' | '' - 4.17.0
onError Handler when img load error, return false to prevent default fallback behavior () => boolean -

Tip: You can set icon or children as the fallback for image load error, with the priority of icon > children

Avatar.Group (4.5.0+)

Property Description Type Default Version
max Set maximum display related configurations, Before 5.18.0 you can use parameters { count?: number; style?: CSSProperties; popover?: PopoverProps } - 5.18.0
size The size of the avatar number | large | small | default | { xs: number, sm: number, ...} default 4.8.0
shape The shape of the avatar circle | square circle 5.8.0

Design Token