Phiên bản: 1.12.0

Avatar

Cập nhật lần cuối: 11/04/2025

import { Avatar } from "zmp-ui";

Dùng để hiển thị ảnh đại diện của người dùng, hỗ trợ dạng hình tròn và fallback khi không có ảnh.

Ví dụ

Name	Type	Default	Description
backgroundColor	`'BLUE-BLUELIGHT'\|'PURPLE-BLUE'\|'SKYBLUE-GREEN'\|'GREEN-GREENLIGHT'`		Màu nền của avatar. Các giá trị hợp lệ bao gồm: `BLUE-BLUELIGHT`: Màu xanh dương đậm `PURPLE-BLUE`: Màu tím-xanh dương `SKYBLUE-GREEN`: Màu xanh da trời nhạt-xanh lá cây `GREEN-GREENLIGHT`: Màu xanh lá cây đậm-xanh lá cây nhạt Nếu không được chỉ định trước và Avatar là string thì giá trị sẽ được tính toán trước dựa trên nội dung Avatar.
blocked	`boolean`	`false`	Trạng thái block của avatar. Nếu có giá trị là true, avatar sẽ hiển thị trạng thái bị khóa.
children	`React.ReactNode`
online	`boolean`	`false`	Hiển thị trạng thái online của Avatar
size	`number`		Kích thước avatar
src	`string`		`src` cho thẻ `img` của avatar
story	`StoryStatus`		Nhận các giá trị: `default`, `seen`
onClick	`React.MouseEventHandler`		Callback được gọi khi người dùng nhấn chuột vào avatar.