[Vue]Vant Toast全局提示封装

[Vue]Vant Toast全局提示封装

import { Toast } from 'vant';

export function openLoading(text) {
    Toast.loading({
        message: text || '',
        duration: 0, // 持续展示 toast
        forbidClick: true, // 禁用背景点击
        overlay: true,
        loadingType: 'spinner' //默认 circular
    });
}

export function closeLoading() {
    Toast.clear();
}

export const VantToast = Toast;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

使用

import { openLoading, closeLoading, VantToast } from '@/components/Loading';


VantToast('网络错误');


// 打开加载动画
openLoading()

// 关闭加载动画
closeLoading()
1
2
3
4
5
6
7
8
9
10
11