uniapp弹窗方式

最新推荐文章于 2025-06-04 09:12:13 发布

Yui_NIE

最新推荐文章于 2025-06-04 09:12:13 发布

阅读量1.7k

点赞数 39

CC 4.0 BY-SA版权

文章标签： uni-app 前端 javascript

本文链接：https://blog.csdn.net/Yui_NIE/article/details/137159615

本文介绍了在uni-app开发中使用的四种常见UI组件：文字弹窗（toastr）、成功提示、取消确认对话框以及加载中提示。这些组件展示了如何在用户界面中展示不同类型的消息和操作反馈。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文字弹窗

uni.showToast({
				title: '文字弹窗',
				icon: 'none',    
				duration: 2000    
			})

图标文字弹框

uni.showToast({
				title: '成功提示弹窗',
				icon: 'success',    
				duration: 2000    
			})

取消确认弹框

uni.showModal({
					title: '标题',
					content: '副标题',
					success: function(res) {
					if (res.confirm) {
						console.log('点击了确认')
					} else {
						console.log('点击了取消')
					}
				}
			})

图片提示框

uni.showToast({
				title: '标题',
				image: '../../../static/logo.png',//使用本地的图片
				duration: 2000     
			})

加载中提示框

			uni.showLoading({
				title:'加载中...'
			});
			uni.hideLoading();//取消

uni.showToast(OBJECT) | uni-app官网