Skip to content
On this page

Toast 轻提示

代码演示

文字提示

dart
ToastStatic.show(context, message: "提示内容");

成功提示

dart
ToastStatic.show(
  context,
  type: VanToastType.success,
  message: "成功文案",
);

失败提示

dart
ToastStatic.show(
  context,
  type: VanToastType.fail,
  message: "失败文案",
);

自定义图标

dart
ToastStatic.show(
  context,
  icon: Image.network(
    "https://fastly.jsdelivr.net/npm/@vant/assets/logo.png",
    width: 32,
    height: 32,
  ),
  message: "自定义图片",
);

顶部展示

dart
ToastStatic.show(
  context,
  position: VanToastPosition.top,
  message: "顶部展示",
);

底部展示

dart
ToastStatic.show(
  context,
  position: VanToastPosition.bottom,
  message: "底部展示",
);

自定义绘制

dart
ToastStatic.show(
  context,
  padding: EdgeInsets.zero,
  message: Image.network(
    "https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg",
    width: 200,
    height: 140,
  ),
);

多实例

根据不同的 key 分离出多个实例展示

dart
ToastStatic.show(
  context,
  position: VanToastPosition.top,
  message: "多实例 A",
  key: "AToast",
);

API

Props类型描述
contextBuildContext上下文,需要从上下文获取覆盖层挂载
positiontop | bottom | center弹出位置
durationDuration弹出时间
overlaybool遮罩层
closeOnClickOverlaybool点击遮罩层关闭
typeloading | success | fail | text类型
paddingEdgeInsets文本内间距
iconWidget | IconData图标
messageWidget | String内容
keyString多实例标识