vant/docs/markdown/zh-CN/toast.md

Toast 轻提示

使用指南

import { Toast } from 'vant';

代码演示

文字提示

Toast('我是提示文案，建议不超过十五字~');

加载提示

Toast.loading({ mask: true });

成功/失败提示

Toast.success('成功文案');
Toast.fail('失败文案');

高级用法

const toast = Toast.loading({
  duration: 0,       // 持续展示 toast
  forbidClick: true, // 禁用背景点击
  message: '倒计时 3 秒'
});

let second = 3;
const timer = setInterval(() => {
  second--;
  if (second) {
    toast.message = `倒计时 ${second} 秒`;
  } else {
    clearInterval(timer);
    Toast.clear();
  }
}, 1000);

方法

方法名	参数	返回值	介绍
Toast	`options	message`	toast 实例
Toast.loading	`options	message`	toast 实例
Toast.success	`options	message`	toast 实例
Toast.fail	`options	message`	toast 实例
Toast.clear	-	void	关闭提示

Options

参数	说明	类型	默认值	可选值
type	提示类型	String	text	loading success fail html
message	内容	String	''	-
position	位置	String	middle	top bottom
mask	是否显示背景蒙层	Boolean	false	-
forbidClick	禁止背景点击	Boolean	false	-
duration	时长(ms)	Number	3000	值为 0 时，toast 不会消失