# 界面API
# showToast
showToast(object)
object 参数
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| title | title | 无 | 是 | 提示的内容 |
| icon | string | 'success' | 否 | 图标 |
| image | string | 无 | 否 | 自定义图标的本地路径或 url ,image 的优先级高于 icon |
| duration | number | 1500 | 否 | 提示的延迟时间(毫秒) |
| mask | boolean | false | 否 | 是否显示透明蒙层,防止触摸穿透 |
| success | function | 无 | 否 | 接口调用成功的回调函数 |
| fail | function | 无 | 否 | 接口调用失败的回调函数 |
| complete | function | 无 | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
object.icon 的合法值
| 值 | 说明 |
|---|---|
| success | 显示成功图标,此时 title 文本最多显示 7 个汉字长度 |
| error | 显示失败图标,此时 title 文本最多显示 7 个汉字长度 |
| loading | 显示加载图标,此时 title 文本最多显示 7 个汉字长度 |
| none | 不显示图标,此时 title 文本最多可显示两行,1.9.0及以上版本支持 |
示例
app.showToast({
title: '成功',
icon: 'success',
duration: 2000, // 2秒
});
app.showToast({
title: '失败',
icon: 'error',
duration: 2000, // 2秒
mask: false,
});
# showLoading
showLoading(object)
显示 loading 提示框。支持 promise 风格调用。需主动调用 app.hideLoading 才能关闭提示框。
object 参数
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| title | string | 无 | 否 | 提示的内容 |
| mask | boolean | false | 否 | 是否显示透明蒙层,防止触摸穿透 |
| success | function | 无 | 否 | 接口调用成功的回调函数 |
| fail | function | 无 | 否 | 接口调用失败的回调函数 |
| complete | function | 无 | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例
app.showLoading({
title: '加载中',
});
# hideLoading
hideLoading(object)
隐藏 loading 提示框。支持 promise 风格调用。需主动调用 app.hideLoading 才能关闭提示框。
object 参数
| 属性 | 类型 | 必填 | 说明 |
|---|---|---|---|
| success | function | 否 | 接口调用成功的回调函数 |
| fail | function | 否 | 接口调用失败的回调函数 |
| complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例
app.hideLoading({
title: '加载中',
success: () => {
console.log("success")
},
fail: () => {
console.log("fail")
},
complete: () => {
console.log("complete")
},
});
# showModal
showModal(object)
显示模态对话框,支持 promise 风格调用 。
object 参数
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| title | string | 无 | 否 | 提示的标题 |
| content | string | 无 | 否 | 提示的内容 |
| showCancel | boolean | true | 否 | 是否显示取消按钮 |
| cancelText | string | '取消' | 否 | 取消按钮的文字,最多 4 个字符 |
| cancelColor | string | #000000 | 否 | 取消按钮的文字颜色,必须是 16 进制格式的颜色字符串 |
| confirmText | string | '确定' | 否 | 确认按钮的文字,最多 4 个字符 |
| confirmColor | string | #576B95 | 否 | 确认按钮的文字颜色,必须是 16 进制格式的颜色字符串 |
| success | function | 无 | 否 | 接口调用成功的回调函数 |
| fail | function | 无 | 否 | 接口调用失败的回调函数 |
| complete | function | 无 | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
object.success 回调函数
| 属性 | 类型 | 说明 |
|---|---|---|
| content | string | editable 为 true 时,用户输入的文本 |
| confirm | boolean | 为 true 时,表示用户单击了确定按钮 |
| cancel | boolean | 为 true 时,表示用户单击了取消 |
示例
app.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 单击蒙层不会关闭模态弹窗,所以尽量避免使用取消分支中实现业务逻辑