微信小程序几种常用弹窗提示方法

1.提示文字

可以设置显示时间(仅提示时使用)duration设置时间

不显示icon,此时 title文字最多可显示两行

也可以显示icon,显示icon文字最多显示 7 个汉字长度

icon常用的有:success、error、loading

wx.showToast({
  title: '成功',
  icon: 'success',
  duration: 2000
})

示例图片

2.模态对话框

 可以确认和关闭

wx.showModal({
	title: '提示',
    content: '确定要取消订单吗?',
	success (res) {
		if (res.confirm) {
			//这里是点击确认执行事件
		} else if (res.cancel) {
	        //这里是点击取消执行事件
		}
	 }
})

如图

3.loading 提示框

显示 loading 提示框。需主动调用 wx.hideLoading 才能关闭提示框 

注意:wx.showLoading 和 wx.showToast 同时只能显示一个

wx.showLoading({
  title: '加载中',
})

setTimeout(function () {
  wx.hideLoading()
}, 2000)

如图:

4.行选择弹窗

itemList数组所对应的选项 

wx.showActionSheet({
	itemList:['A', 'B', 'C'], 
	success: (res) => {
	switch(res.tapIndex) {
		case 0:
			console.log('a')
			break;
		case 1:
			console.log('b')
			break;	
		case 2:
			console.log('c')
			break;
		}
	},
	fail (res) {
		console.log('取消')
	}
})

如图

 

微信小程序文档地址:wx.showToast(Object object) | 微信开放文档

猜你喜欢

转载自blog.csdn.net/weixin_48951113/article/details/129390004
今日推荐