当前位置:   article > 正文

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

小程序弹窗

1.提示文字

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

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

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

icon常用的有:success、error、loading

  1. wx.showToast({
  2. title: '成功',
  3. icon: 'success',
  4. duration: 2000
  5. })

示例图片

2.模态对话框

 可以确认和关闭

  1. wx.showModal({
  2. title: '提示',
  3. content: '确定要取消订单吗?',
  4. success (res) {
  5. if (res.confirm) {
  6. //这里是点击确认执行事件
  7. } else if (res.cancel) {
  8. //这里是点击取消执行事件
  9. }
  10. }
  11. })

如图

 

3.loading 提示框

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

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

  1. wx.showLoading({
  2. title: '加载中',
  3. })
  4. setTimeout(function () {
  5. wx.hideLoading()
  6. }, 2000)

如图:

4.行选择弹窗

itemList数组所对应的选项 

  1. wx.showActionSheet({
  2. itemList:['A', 'B', 'C'],
  3. success: (res) => {
  4. switch(res.tapIndex) {
  5. case 0:
  6. console.log('a')
  7. break;
  8. case 1:
  9. console.log('b')
  10. break;
  11. case 2:
  12. console.log('c')
  13. break;
  14. }
  15. },
  16. fail (res) {
  17. console.log('取消')
  18. }
  19. })

如图

 

 

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

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/不正经/article/detail/98494
推荐阅读
相关标签
  

闽ICP备14008679号