ImageViewer
import { ImageViewer } from "zmp-ui";
Dùng để tạo một gallery cho phép người dùng xem hình ảnh với kích thước của màn hình, có thể tương tác thu phóng, chuyển hình,...
Ví dụ
Bảng thuộc tính
ImageViewerProps
| Property | Type | Required | Description |
|---|---|---|---|
| images | ImageType[] | No | Mảng chứa thông tin của các ảnh cần hiển thị. Mỗi thiết lập bao gồm đường dẫn và mô tả của ảnh. Chi tiết xem . |
| activeIndex | number | No | Index của ảnh đang được hiển thị. |
| visible | boolean | No | Trạng thái hiển thị của image viewer. Cần được sử dụng cùng với `onClose` để đóng image viewer. (default: false) |
| onClose | () => void | No | Callback được gọi khi image viewer được đóng. Cần phải update lại state của `visible` nếu được truyền vào. |
| maskStyle | CSSProperties | No | Inline style cho mask của image viewer. |
| maskClassName | string | No | CSS class cho mask của image viewer. |
ImageType
| Property | Type | Required | Description |
|---|---|---|---|
| src | string | No | Đường dẫn của ảnh. |
| alt | string | No | Mô tả của ảnh. Sẽ được hiển thị khi không thể load ảnh. |