codecamp

微信小程序API 交互反馈

wx.showToast(OBJECT)

显示消息提示框。

OBJECT参数说明:

参数类型必填说明最低版本
titleString提示的内容 
iconString图标,有效值"success"、"loading" 
imageString自定义图标的本地路径,image 的优先级高于 icon1.1.0
durationNumber提示的延迟时间,单位毫秒,默认:1500 
maskBoolean是否显示透明蒙层,防止触摸穿透,默认:false 
successFunction接口调用成功的回调函数 
failFunction接口调用失败的回调函数 
completeFunction接口调用结束的回调函数(调用成功、失败都会执行) 

示例代码:

wx.showToast({
  title: '成功',
  icon: 'success',
  duration: 2000
})

wx.showLoading(OBJECT)

基础库版本 1.1.0 开始支持,低版本需做兼容处理

显示 loading 提示框, 需主动调用 wx.hideLoading 才能关闭提示框

OBJECT参数说明:

参数类型必填说明
titleString提示的内容
maskBoolean是否显示透明蒙层,防止触摸穿透,默认:false
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

wx.hideToast()

隐藏消息提示框

wx.hideLoading()


基础库版本 1.1.0 开始支持,低版本需做兼容处理

隐藏loading提示框

wx.showLoading({
  title: '加载中',
})

setTimeout(function(){
  wx.hideLoading()
},2000)

wx.showModal(OBJECT)

​显示模态弹窗

OBJECT参数说明:

参数类型必填说明
titleString提示的标题
contentString提示的内容
showCancelBoolean是否显示取消按钮,默认为 true
cancelTextString取消按钮的文字,默认为"取消",最多 4 个字符
cancelColorHexColor取消按钮的文字颜色,默认为"#000000"
confirmTextString确定按钮的文字,默认为"确定",最多 4 个字符
confirmColorHexColor确定按钮的文字颜色,默认为"#3CC51F"
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

succes返回参数说明:

参数类型说明最低版本
confirmBoolean为 true 时,表示用户点击了确定按钮 
cancelBoolean为 true 时,表示用户点击了取消(用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭)1.1.0

示例代码:

wx.showModal({
  title: '提示',
  content: '这是一个模态弹窗',
  success: function(res) {
    if (res.confirm) {
      console.log('用户点击确定')
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
})

wx.showActionSheet(OBJECT)

​显示操作菜单

OBJECT参数说明:

参数类型必填说明
itemListString Array按钮的文字数组,数组长度最大为6个
itemColorHexColor按钮的文字颜色,默认为"#000000"
successFunction接口调用成功的回调函数,详见返回参数说明
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数类型说明
tapIndexNumber用户点击的按钮,从上到下的顺序,从0开始

示例代码:

wx.showActionSheet({
  itemList: ['A', 'B', 'C'],
  success: function(res) {
    console.log(res.tapIndex)
  },
  fail: function(res) {
    console.log(res.errMsg)
  }
})

Bug & Tip

  1. bug:Android6.3.30,wx.showModal 的返回的 confirm 一直为 true;
  2. tip: wx.showActionSheet 点击取消或蒙层时,回调fail, errMsg 为 "showActionSheet:fail cancel";
  3. tip: wx.showLoading 和 wx.showToast 同时只能显示一个,使用 wx.hideToast/wx.hideLoading 都可以关闭提示框;
  4. tip: iOS wx.showModal 点击蒙层不会关闭模态弹窗,所以尽量避免使用“取消”分支中实现业务逻辑。
微信小程序API NFC·NfcV标签
微信小程序API 设置导航条
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

微信小程序 指南

目录结构

开放能力

微信小程序 调试

微信小程序 实时日志

微信小程序 小程序测速

微信小程序 基础组件

微信小程序 API

媒体

界面

微信小程序API 绘图

微信小程序 服务端

接口调用凭证

统一服务消息

微信小程序 服务市场

微信小程序 生物认证

微信小程序 云开发

服务端

微信小程序云开发服务端API 数据库

SDK文档

微信小程序 扩展能力

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }