Chuyển tới nội dung chính
Phiên bản: 1.11.0

SnackbarProvider

import { SnackbarProvider } from "zmp-ui";

Dùng để tạo thông báo nhanh hiển thị lên trên giao diện ứng dụng, sự dụng thông báo về thông tin thêm, trạng thái thành công hoặc lỗi xảy ra khi sử dụng một hành động, quá trình download, trạng thái kết nối,...

Ví dụ

Bảng thuộc tính

SnackbarProps

NameTypeDefaultDescription
childrenReactNode

Nội dung cần được hiển thị trong snackbar

zIndexnumber

Tuỳ chỉnh độ sâu của snackbar, sử dụng khi có nhiều phần tử overlay lên nhau.

SnackbarContext

NameTypeDefaultDescription
closeSnackbar() => void

Hàm để đóng một Snackbar, có thể sử dụng để đóng nhanh khi chưa hết thời gian hiển thị.

openSnackbar(options: SnackbarOptions) => void

Hàm để tạo mới và mở một Snackbar. Có thể mở Snackbar với các

setDownloadProgress(completed: number) => void

Cập nhật phần trăm tiến trình download (0 - 100) khi sử dụng với typedownload.

SnackbarAction

NameTypeDefaultDescription
closeboolean
textstring
onClick(event: React.MouseEvent) => void

SnackbarOptions

NameTypeDefaultDescription
actionSnackbarAction
durationnumber
iconboolean
positionSnackbarPosition
prefixIconReactNode
textstring
typeSnackbarType
verticalActionboolean
zIndexnumber
onClose() => void

SnackbarProvider

zi-chevron-up
miniapp-logo

Khám phá