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

大家好，欢迎来到IT知识分享网。

第一种：弹出提示框，可以选择确定或者取消。
代码：
 wx.showModal({ 
   
     title: '提示',
     content: '这是一个模态弹窗',
     success: function (res) { 
   
       if (res.confirm) { 
   //这里是点击了确定以后
         console.log('用户点击确定')
       } else { 
   //这里是点击了取消以后
         console.log('用户点击取消')
       }
     }
   })

效果图

第二种：不带确定和取消的，直接提示成功
代码：
 wx.showToast({ 
   
     title: '成功',
     icon: 'success',
     duration: 2000//持续的时间
   })

效果图

第三种：提示等待中...，
代码：
wx.showToast({ 
   
     title: '加载中...',
     icon: 'loading',
     duration: 2000//持续的时间
   })

效果图

第四种：提示文字，没有任何图标效果，但是文字可以写的很多。
代码：
   wx.showToast({ 
   
     title: '这里面可以写很多的文字，比其他的弹窗都要多！',
     icon: 'none',
     duration: 2000//持续的时间
   })

效果图

第五种：弹窗提示选择，例如选择ABCD那种
代码：
wx.showActionSheet({ 
   
     itemList: ['A', 'B', 'C'],
     success: function (res) { 
   
       if (!res.cancel) { 
   
         console.log(res.tapIndex)//这里是点击了那个按钮的下标
       }
     }
   })

第六种：多用于页面提示加载中
代码：
<loading hidden="{ 
   {hidden}}">
       加载中...
</loading>
hidden有两个值：false和true

效果图

加载中
  wx.showLoading({ 
   
        title: '加载中...',
   })
手动关闭加载中
   wx.hideLoading();

效果图