1.wx.showToast(Object object)
显示消息提示框
| 属性 | 类型 | 默认值 | 必填 | 说明 | 最低版本 | ||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| title | string | 是 | 提示的内容 | ||||||||||||||||||
| icon | string | success | 否 | 图标 | |||||||||||||||||
|
|||||||||||||||||||||
| image | string | 否 | 自定义图标的本地路径，image 的优先级高于 icon | 1.1.0 | |||||||||||||||||
| duration | number | 1500 | 否 | 提示的延迟时间 | |||||||||||||||||
| mask | boolean | false | 否 | 是否显示透明蒙层，防止触摸穿透 | |||||||||||||||||
| success | function | 否 | 接口调用成功的回调函数 | ||||||||||||||||||
| fail | function | 否 | 接口调用失败的回调函数 | ||||||||||||||||||
| complete | function | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） | ||||||||||||||||||
wx.showToast({
title: '成功',
icon: 'success',
duration: 2000
})效果如图： 
取消icon效果：
注意：
- wx.showLoading 和 wx.showToast 同时只能显示一个
- wx.showToast 应与 wx.hideToast 配对使用
2.wx.showModal(Object object)
显示模态对话框
| 属性 | 类型 | 默认值 | 必填 | 说明 | 最低版本 |
|---|---|---|---|---|---|
| title | string | 否 | 提示的标题 | ||
| content | string | 否 | 提示的内容 | ||
| showCancel | boolean | true | 否 | 是否显示取消按钮 | |
| cancelText | string | 取消 | 否 | 取消按钮的文字，最多 4 个字符 | |
| cancelColor | string | #000000 | 否 | 取消按钮的文字颜色，必须是 16 进制格式的颜色字符串 | |
| confirmText | string | 确定 | 否 | 确认按钮的文字，最多 4 个字符 | |
| confirmColor | string | #576B95 | 否 | 确认按钮的文字颜色，必须是 16 进制格式的颜色字符串 | |
| editable | boolean | false | 否 | 是否显示输入框 | 2.17.1 |
| placeholderText | string | 否 | 显示输入框时的提示文本 | 2.17.1 | |
| success | function | 否 | 接口调用成功的回调函数 | ||
| fail | function | 否 | 接口调用失败的回调函数 | ||
| complete | function | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
object.success 回调函数
| 属性 | 类型 | 说明 | 最低版本 |
|---|---|---|---|
| content | string | editable 为 true 时，用户输入的文本 | |
| confirm | boolean | 为 true 时，表示用户点击了确定按钮 | |
| cancel | boolean | 为 true 时，表示用户点击了取消（用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭） | 1.1.0 |
wx.showModal({
title: '提示',
content: '这是一个模态弹窗',
success (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})示例图：
注意：
- Android 6.7.2 以下版本，点击取消或蒙层时，回调 fail, errMsg 为 "fail cancel"；
- Android 6.7.2 及以上版本 和 iOS 点击蒙层不会关闭模态弹窗，所以尽量避免使用「取消」分支中实现业务逻辑
- 自基础库 2.17.1 版本起，支持传入 editable 参数，显示带输入框的弹窗
3.wx.showLoading(Object object)
显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框
Object object
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| title | string | 是 | 提示的内容 | |
| mask | boolean | false | 否 | 是否显示透明蒙层，防止触摸穿透 |
| success | function | 否 | 接口调用成功的回调函数 | |
| fail | function | 否 | 接口调用失败的回调函数 | |
| complete | function | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
wx.showLoading({
title: '加载中',
})
setTimeout(function () {
wx.hideLoading()
}, 2000)
示例图：
注意：
- wx.showLoading 和 wx.showToast 同时只能显示一个
- wx.showLoading 应与 wx.hideLoading 配对使用
其余参考官网文章来源：https://www.toymoban.com/news/detail-767753.html
wx.showToast(Object object) | 微信开放文档文章来源地址https://www.toymoban.com/news/detail-767753.html
到了这里，关于微信小程序常用弹框介绍及使用案例说明的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
