微信小程序常用的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 操作select下拉列表框的一点小经验
Mar 20 Javascript
Javascript根据指定下标或对象删除数组元素
Dec 21 Javascript
js使用for循环及if语句判断多个一样的name
Sep 09 Javascript
jQuery使用after()方法在元素后面添加多项内容的方法
Mar 26 Javascript
js中的内部属性与delete操作符介绍
Aug 10 Javascript
jQuery添加删除DOM元素方法详解
Jan 18 Javascript
js获取腾讯视频ID的方法
Oct 03 Javascript
详解Angular.js的$q.defer()服务异步处理
Nov 06 Javascript
基于node.js依赖express解析post请求四种数据格式
Feb 13 Javascript
JS数组操作之增删改查的简单实现
Aug 21 Javascript
浅谈es6语法 (Proxy和Reflect的对比)
Oct 24 Javascript
JS实现的计数排序与基数排序算法示例
Dec 04 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 isset()与empty()的使用区别详解
2010/08/29 PHP
使用迭代器 遍历文件信息的详解
2013/06/08 PHP
laravel5.6中的外键约束示例
2019/10/23 PHP
Javascript中Eval函数的使用
2010/03/23 Javascript
jQuery Dialog 弹出层对话框插件
2010/08/09 Javascript
juqery 学习之三 选择器 可见性 元素属性
2010/11/25 Javascript
禁用页面部分JavaScript方法的具体实现
2013/07/31 Javascript
Javascript中的几种URL编码方法比较
2015/01/23 Javascript
NodeJS Web应用监听sock文件实例
2015/02/18 NodeJs
JavaScript中0和""比较引发的问题
2016/05/26 Javascript
完美解决jQuery符号$与其他javascript 库、框架冲突的问题
2016/08/09 Javascript
javascript数组遍历的方法实例分析
2016/09/13 Javascript
利用jquery给指定的table动态添加一行、删除一行的方法
2016/10/12 Javascript
JS中Array数组学习总结
2017/01/18 Javascript
js排序与重组的实例讲解
2017/08/28 Javascript
Vue中的vue-resource示例详解
2018/11/02 Javascript
layui动态渲染生成select的option值方法
2019/09/23 Javascript
使用Python3中的gettext模块翻译Python源码以支持多语言
2015/03/31 Python
python使用socket连接远程服务器的方法
2015/04/29 Python
一百行python代码将图片转成字符画
2021/02/19 Python
Python 3 使用Pillow生成漂亮的分形树图片
2019/12/24 Python
在jupyter notebook 添加 conda 环境的操作详解
2020/04/10 Python
使用pyecharts1.7进行简单的可视化大全
2020/05/17 Python
如何让python的运行速度得到提升
2020/07/08 Python
Python接收手机短信的代码整理
2020/08/02 Python
python之语音识别speech模块
2020/09/09 Python
Python基于爬虫实现全网搜索并下载音乐
2021/02/14 Python
添柏岚英国官方网站:Timberland英国
2019/11/28 全球购物
综合实践教学反思
2014/01/31 职场文书
教学质量评估实施方案
2014/03/17 职场文书
银行服务明星推荐材料
2014/05/29 职场文书
毕业生就业推荐表导师评语
2014/12/31 职场文书
小学班主任工作经验交流材料
2015/11/02 职场文书
大学校园餐饮创业计划书
2019/08/07 职场文书
详解前端任务构建利器Gulp.js使用指南
2021/04/30 Javascript
在pycharm中无法import所安装的库解决方案
2021/05/31 Python