微信小程序常用的3种提示弹窗

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

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

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

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

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

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

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

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

// 开始加载数据
wx.showLoading({
  title: ‘加载中‘,
})

// 数据加载中... // 数据加载中...

// 数据加载完成,隐藏弹窗
wx.hideLoading()

完。

原文地址:https://www.cnblogs.com/yuanyiming/p/11546292.html

时间: 2024-08-01 21:15:22

微信小程序常用的3种提示弹窗的相关文章

微信小程序发布新版本时自动提示用户更新

如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本.用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新. 官方给的示例代码: const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { // 请求完新版本信息的回调 console.log(res.hasUpdate) }) upd

微信小程序安卓机使用uploadfile提示undefined错误原因

前几天开发小程序,在使用微信的uploadfile接口上传图片时,调试工具以及ios的手机无论是拍照,还是选择手机中的图片都可以正常上传图片,而安卓手机在上传图片时,微信总是返回error,且错误提示是undefined(微信返回,数据还没有上传到服务器) 于是网上找资料,找前辈问,未果,总是时好时坏也找不到原因后来,偶然发现,同时上传的字段,如果填写数字,则可以成功提交,如果填写中文则会报错. 于是想到,是不是编码问题,抱着试一试的心态,让前端在上传数据之前加个encodeURI,然后我解析的

微信小程序--常用的页面传值方式

记录小程序中常用的几种页面传值方式 一.storage wx.setStorage({ key: "key", data: value }) 通过getStorage回调方式获取data值,或者通过wx.getStorageSync(key) 同步获取key对应的data值 #### 二.url传值 url传值也是经常都能用到的 ##### 1.url传递通过字符串拼接传递key=value形式的参数 wx.navigateTo({ url: '/pages/index/index?i

微信小程序开发者工具构建npm提示没找到node_modules目录

一.官网给的文档写的不够充分,需要你充分理解npm的使用方法,才能明白的: 二.第一步:先在你电脑上安装npm 参考下面文章 https://www.cnblogs.com/zmdComeOn/p/11543441.html 三.第二步: 1.第一步:打开终端 cd 到项目目录下 输入如下命令: npm init 如下图所示 输入命令后一直点回车,如下图: 2.第二步:输入如下命令 npm install --production 3.第三步:输入如下命令 npm i vant-weapp -S

微信小程序之----加载中提示框loading

loading loading只有一个属性hidden .wxml <view> <loading hidden="{{hidden}}"> 加载中... </loading> <button bindtap="changeHidden">show/hidden</button> </view> .js Page({ data:{ hidden:true }, changeHidden: fun

微信小程序工具真机调试提示page &quot;xxx/xxx/xxx&quot; is not found

解决方法: pages对象添加该页面 原文地址:https://www.cnblogs.com/Zev_Fung/p/9937464.html

微信小程序——常用快捷键【四】

格式调整 ctrl+[, ctrl+]:代码行缩进(向前|向后) ctrl+shift+[, ctrl+shift+] :折叠打开代码块 ctrl+C, ctrl+V:复制粘贴,如果没有选中任何文件则复制粘贴一行 shift+alt+F:代码格式化 alt+up, alt+down:上下移动一行 shift+alt+up, shift+alt+down:向上向下复制一行 ctrl+shift+Enter:在当前行上方插入一行 光标移动 ctrl+End:移动到文件结尾 ctrl+Home:移动到

微信小程序开发者工具构建npm提示没找到node_modules目录(解决方法)

一.官网给的文档写的不够充分,需要你充分理解npm的使用方法,才能明白的: 二.开始步骤: 1.第一步:npm init 2.第二步:npm install --production 3.第三步: npm i vant-weapp -S --production原文:https://blog.csdn.net/zfeng816/article/details/85095885 原文地址:https://www.cnblogs.com/siyecao2010/p/10951477.html

微信小程序常用事件

bind bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡. bindtap  跳转页面 bindchange  .value 改变时触发 change 事件 bindblur. 编辑器失去焦点时触发 bindinput  . 编辑器内容改变时触发 原文地址:https://www.cnblogs.com/ll15888/p/11479933.html