网硕互联帮助中心uni.showToast 是 uni-app 中用于显示消息提示框的 API，可以用来展示简单的操作反馈或状态提示。
基本用法
uni.showToast({
title: "提示内容",
icon: "success",
duration: 2000,
});
参数说明
| title | String | – | 是 | 提示的内容 |
| icon | String | ‘success’ | 否 | 图标类型，有效值包括：‘success’、‘loading’、‘none’ |
| image | – | 否 | 自定义图标的本地路径 | |
| duration | Number | 1500 | 否 | 提示的延迟时间，单位毫秒 |
| mask | Boolean | false | 否 | 是否显示透明蒙层，防止触摸穿透 |
| success | Function | – | 否 | 接口调用成功的回调函数 |
| fail | Function | – | 否 | 接口调用失败的回调函数 |
| complete | Function | – | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
icon 类型说明
- 'success': 显示成功图标
- 'loading': 显示加载图标
- 'none': 不显示图标
示例代码
成功提示
uni.showToast({
title: "操作成功",
icon: "success",
duration: 2000,
});
加载提示
uni.showToast({
title: "加载中…",
icon: "loading",
duration: 3000,
});
无图标提示
uni.showToast({
title: "这是一条提示信息",
icon: "none",
duration: 2000,
});
使用自定义图标
uni.showToast({
title: "自定义图标",
image: "/static/icons/custom.png",
duration: 2000,
});
防止触摸穿透
uni.showToast({
title: "保存成功",
icon: "success",
mask: true,
duration: 2000,
});
注意事项
相关 API
- uni.hideToast(): 隐藏消息提示框
- uni.showLoading(): 显示加载提示框
- uni.hideLoading(): 隐藏加载提示框
评论前必须登录！
注册