Uniapp三种常用提示框

具体参数方法可参考: uniapp交互反馈

uni.showToast(OBJECT)
//显示消息提示框。
uni.hideToast()
//隐藏消息提示框。
//具体使用
uni.showToast({
	title: '新增成功',
	duration: 2000
}); 

在这里插入图片描述

uni.showLoading(OBJECT)
//显示 loading 提示框, 需主动调用 uni.hideLoading 才能关闭提示框。
uni.hideLoading()
//隐藏 loading 提示框。

//具体使用
uni.showLoading({
	title: '加载中'
});

在这里插入图片描述

uni.showModal(OBJECT)
//显示模态弹窗,可以只有一个确定按钮,也可以同时有确定和取消按钮。类似于一个API整合了 html 中:alert、confirm。

//使用
uni.showModal({
	title: '提示',
	content: '你确定要删除吗',
	success: function (res) {
		if (res.confirm) {
			delDateDeviceManager(id).then((res) => {
				uni.showToast({
						title: '删除成功',
						duration: 2000
					});
					that.getDeviceManager();
					});
		} else if (res.cancel) {
			console.log('取消');
			}
		}
})

uni.showActionSheet(OBJECT)
//从底部向上弹出操作菜单
  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uniapp中,可以使用以下方法来显示不同类型的提示框: 1. uni.showToast(): 可以显示一个带有标题和图标的提示框,可以设置标题、图标和显示时长。例如: uni.showToast({ title: '查询中', image: '../../static/loading.gif', duration: 2000 }); 2. uni.showLoading(): 可以显示一个加载框,用于提示用户正在进行加载操作。可以设置加载框的标题和显示时长。例如: uni.showLoading({ title: '加载中' }); setTimeout(function () { uni.hideLoading(); }, 2000); 3. uni.showModal(): 可以显示一个模态弹窗,可以设置弹窗的标题、内容和按钮。可以根据用户点击的按钮来执行不同的操作。例如: uni.showModal({ title: '提示', content: '这是一个模态弹窗', success: function (res) { if (res.confirm) { console.log('用户点击确定'); } else if (res.cancel) { console.log('用户点击取消'); } } }); 4. 自定义输入框弹窗:可以使用uni.showModal()方法来显示一个带有输入框的弹窗,用户可以在弹窗中输入内容。例如: uni.showModal({ title: '输入框', content: '', editable: true, placeholderText: '', showCancel: true, success: (res) => { if (res.confirm) { console.log('输入的内容:', res.content); } } }); 以上是uniapp常用提示框方法,可以根据需要选择适合的方法来显示提示框。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [uni-app的几种提示框](https://blog.csdn.net/weixin_48596030/article/details/123904580)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *3* [uniapp常用提示弹框](https://blog.csdn.net/zhanglinsen123/article/details/125308866)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值