微信小程序常用的3种提示弹窗实现方式

这篇博客介绍了微信小程序中使用wx.showToast和wx.showLoading接口进行操作成功提示、加载中提示以及无图标提示的方法。示例代码展示了如何在不同场景下使用这些接口,并指出wx.showLoading需要手动调用wx.hideLoading来关闭加载提示。

1. 表示操作成功,文字上方会显示一个表示操作成功的图标。

wx.showToast({

  title: '操作成功!', // 标题

  icon: 'success',  // 图标类型,默认success

  duration: 1500  // 提示窗停留时间,默认1500ms

})


2.表示加载中,显示为加载中图标。

wx.showToast({

  title: '加载中...',

  icon: 'loading',

  duration: 1500

})

3.不显示图标,一般用作提示。

wx.showToast({

  title: '该功能未上线!',

  icon: 'none',

  duration: 1500

})

此外,表示加载中的弹窗还可以使用wx.showLoading接口,但调用该接口时弹窗并不会自动消失,而是需要手动调用wx.hideLoading接口使弹窗消失。以上3种弹窗均使用wx.showToast接口,调用后会根据设定的duration停留一定时间。

// 开始加载数据

wx.showLoading({

 title: '加载中',

})

// 数据加载中... // 数据加载中...

// 数据加载完成,隐藏弹窗

wx.hideLoading()

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值