微信小程序常用的3种提示弹窗实现详解


Posted in Javascript onSeptember 19, 2019

1. 表示操作成功,文字上方会显示一个表示操作成功的图标。

微信小程序常用的3种提示弹窗实现详解

wx.showToast({
  title: '操作成功!', // 标题
  icon: 'success',  // 图标类型,默认success
  duration: 1500  // 提示窗停留时间,默认1500ms
})

2.表示加载中,显示为加载中图标。

微信小程序常用的3种提示弹窗实现详解

wx.showToast({
  title: '加载中...',
  icon: 'loading',
  duration: 1500
})

3.不显示图标,一般用作提示。

微信小程序常用的3种提示弹窗实现详解

wx.showToast({
  title: '该功能未上线!',
  icon: 'none',
  duration: 1500
})

以上3种弹窗均使用wx.showToast接口,调用后会根据设定的duration停留一定时间。

此外,表示加载中的弹窗还可以使用wx.showLoading接口,但调用该接口时弹窗并不会自动消失,而是需要手动调用wx.hideLoading接口使弹窗消失。

// 开始加载数据
wx.showLoading({
 title: '加载中',
})
// 数据加载中... // 数据加载中...
// 数据加载完成,隐藏弹窗
wx.hideLoading()

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript实现点击链接弹出"图片另存为"而不是直接打开
Aug 15 Javascript
来自国外的页面JavaScript文件优化
Dec 08 Javascript
纯文字版返回顶端的js代码
Aug 01 Javascript
js 操作select与option(示例讲解)
Dec 20 Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
Jan 16 Javascript
JS获取当前网页大小以及屏幕分辨率等
Sep 05 Javascript
jQuery的position()方法详解
Jul 19 Javascript
详解JavaScript表单验证(E-mail 验证)
Mar 31 Javascript
vscode中vue-cli项目es-lint的配置方法
Jul 30 Javascript
详解Vue中的基本语法和常用指令
Jul 23 Javascript
Vue 解决路由过渡动画抖动问题(实例详解)
Jan 05 Javascript
vue v-model的用法解析
Oct 19 Javascript
微信小程序防止多次点击跳转和防止表单组件输入内容多次验证功能(函数防抖)
Sep 19 #Javascript
vue 设置 input 为不可以编辑的实现方法
Sep 19 #Javascript
node 标准输入流和输出流代码实例
Sep 19 #Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
Sep 19 #Javascript
微信小程序3D轮播实现代码
Sep 19 #Javascript
layui 实现表格某一列显示图标
Sep 19 #Javascript
微信小程序防止多次点击跳转(函数节流)
Sep 19 #Javascript
You might like
PHP新手上路(四)
2006/10/09 PHP
使用PHP实现阻止用户上传成人照片或者裸照
2014/12/25 PHP
PHP实现自动对图片进行滚动显示的方法
2015/03/12 PHP
详解PHP中的Traits
2015/07/29 PHP
PHP封装的字符串加密解密函数
2015/12/18 PHP
php结合web uploader插件实现分片上传文件
2016/05/10 PHP
PHP文字转图片功能原理与实现方法分析
2017/08/31 PHP
PHP实现的简单组词算法示例
2018/04/10 PHP
php workerman定时任务的实现代码
2018/12/23 PHP
网页常用特效代码整理
2006/06/23 Javascript
基于JQuery实现相同内容合并单元格的代码
2011/01/12 Javascript
JS解析json数据并将json字符串转化为数组的实现方法
2012/12/25 Javascript
javascript的回调函数应用示例
2014/02/20 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
2016/06/03 Javascript
详解AngularJS脏检查机制及$timeout的妙用
2017/06/19 Javascript
vue+koa2实现session、token登陆状态验证的示例
2019/08/30 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
2019/10/23 Javascript
Vue 中 a标签上href无法跳转的解决方式
2019/11/12 Javascript
Vue3 响应式侦听与计算的实现
2020/11/11 Javascript
Python 中 list 的各项操作技巧
2017/04/13 Python
浅析python 中大括号中括号小括号的区分
2019/07/29 Python
python3中pip3安装出错,找不到SSL的解决方式
2019/12/12 Python
python实现翻译word表格小程序
2020/02/27 Python
windows下的pycharm安装及其设置中文菜单
2020/04/23 Python
简单了解Python多态与属性运行原理
2020/06/15 Python
Python读取xlsx数据生成图标代码实例
2020/08/12 Python
关于python3.9安装wordcloud出错的问题及解决办法
2020/11/02 Python
Audible英国:有声读物,30天免费试用
2019/10/16 全球购物
俄罗斯最大的灯具网站:Fandeco
2020/03/14 全球购物
日语系毕业生推荐信
2013/11/11 职场文书
幼儿园中班教师寄语
2014/04/03 职场文书
酒店管理求职信范文
2014/04/06 职场文书
商场开业庆典策划方案
2014/06/02 职场文书
2016年大学生社会实践心得体会
2015/10/09 职场文书
python 破解加密zip文件的密码
2021/04/22 Python
mysql获取指定时间段中所有日期或月份的语句(不设存储过程,不加表)
2021/06/18 MySQL