Vant 中的Toast设置全局的延迟时间操作


Posted in Javascript onNovember 04, 2020

在引入Toast的配置文件里面配置如下:

import { Toast } from 'vant';
Vue.use(Toast);
Toast.setDefaultOptions({ duration: 800 });  // duration延迟时间

--完。

补充知识:vant ui库 toast 的使用及封装

最近在写一个项目,表单项较多,那必然前端做验证也是必须的了,一个一个写太繁琐,封装起来直接调用即可:

1、新建 toast.js

import { Toast } from 'vant'
import 'vant/lib/index.css'

export function toast(message, duration = 1000) {
  Toast({
    message, duration
  });
 }

2、在组件中使用

import { toast } from'../assets/js/toast'

toast('提示信息');

以上这篇Vant 中的Toast设置全局的延迟时间操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery右键菜单contextMenu使用实例
Sep 28 Javascript
学习JavaScript的最佳方法分享
Oct 21 Javascript
怎样在JavaScript里写一个swing把数据插入数据库
Dec 10 Javascript
一个JavaScript变量声明的知识点
Oct 28 Javascript
java与javascript之间json格式数据互转介绍
Oct 29 Javascript
jquery.post用法示例代码
Jan 03 Javascript
Select2.js下拉框使用小结
Oct 24 Javascript
JS控制div跳转到指定的位置的几种解决方案总结
Nov 05 Javascript
javascript性能优化之分时函数的介绍
Mar 28 Javascript
Vue2实时监听表单变化的示例讲解
Aug 30 Javascript
解决iview多表头动态更改列元素发生的错误的方法
Nov 02 Javascript
解决LayUI数据表格复选框不居中显示的问题
Sep 25 Javascript
vue 使用vant插件做tabs切换和无限加载功能的实现
Nov 04 #Javascript
Vue获取微博授权URL代码实例
Nov 04 #Javascript
基于vue实现微博三方登录流程解析
Nov 04 #Javascript
Javascript执行上下文顺序的深入讲解
Nov 04 #Javascript
解决vant中 tab栏遇到的坑 van-tabs
Nov 04 #Javascript
解决Mint-ui 框架Popup和Datetime Picker组件滚动穿透的问题
Nov 04 #Javascript
基于js实现的图片拖拽排序源码实例
Nov 04 #Javascript
You might like
关于PHP session 存储方式的详细介绍
2013/06/25 PHP
JavaScript 数组的 uniq 方法
2008/01/23 Javascript
TinyMCE 新增本地图片上传功能
2010/11/05 Javascript
javascript 基础篇2 数据类型,语句,函数
2012/03/14 Javascript
基于jquery的DIV随滚动条滚动而滚动的代码
2012/07/20 Javascript
用innerhtml提高页面打开速度的方法
2013/08/02 Javascript
javascript图片相似度算法实现 js实现直方图和向量算法
2014/01/14 Javascript
Javascript学习笔记之 对象篇(三) : hasOwnProperty
2014/06/24 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
2016/11/01 Javascript
Bootstrap CSS组件之面包屑导航(breadcrumb)
2016/12/17 Javascript
详解百度百科目录导航树小插件
2017/01/08 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
webpack之devtool详解
2018/02/10 Javascript
微信小程序中使用ECharts 异步加载数据实现图表功能
2018/07/13 Javascript
JS通过位运算实现权限加解密
2018/08/14 Javascript
vue+axios+element ui 实现全局loading加载示例
2018/09/11 Javascript
Vue项目中最新用到的一些实用小技巧
2018/11/06 Javascript
React组件对子组件children进行加强的方法
2019/06/23 Javascript
Python栈算法的实现与简单应用示例
2017/11/01 Python
Python网络编程基于多线程实现多用户全双工聊天功能示例
2018/04/10 Python
python中的decorator的作用详解
2018/07/26 Python
python简易实现任意位数的水仙花实例
2018/11/13 Python
python使用writerows写csv文件产生多余空行的处理方法
2019/08/01 Python
PyTorch实现AlexNet示例
2020/01/14 Python
如何使用python切换hosts文件
2020/04/29 Python
canvas学习笔记之2d画布基础的实现
2019/02/21 HTML / CSS
HTML5适合的情人节礼物有纪念日期功能
2021/01/25 HTML / CSS
职称自我鉴定
2013/10/15 职场文书
大学生毕业鉴定
2014/01/31 职场文书
十佳中学生事迹材料
2014/06/02 职场文书
环境工程专业自荐信范文
2014/06/24 职场文书
企业党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2014年小学校长工作总结
2014/12/08 职场文书
运动员代表致辞
2015/07/29 职场文书
2019 入党申请书范文
2019/07/10 职场文书
java中用float时,数字后面加f,这样是为什么你知道吗
2021/09/04 Java/Android