微信小程序之弹框

一、提示框

wx.showToast({
         title: '刷新成功',//提示文字
         duration:2000,//显示时长
         mask:true,//是否显示透明蒙层,防止触摸穿透,默认:false  
         icon:'success', //图标,支持"success"、"loading"  
         success:function(){ },//接口调用成功
         fail: function () { },  //接口调用失败的回调函数  
         complete: function () { } //接口调用结束的回调函数  
      })

效果展示:
图标展示
二、选择框

wx.showModal({
      title: '用户登录',      
      content: '确定使用微信账号登录?',      
      showCancel: true,//是否显示取消按钮      
      cancelText: "取消",//默认是“取消”      
      cancelColor: '#DEB887',//取消文字的颜色      
      confirmText: "确定",//默认是“确定”      
      confirmColor: '#DEB887',//确定文字的颜色      
      success: function (res) {
              if (res.cancel) {
                  //点击取消,默认隐藏弹框        
              } else {
                  //点击确定          
                   temp.splice(index, 1),            
                   that.setData({
                                 tempFilePaths: temp,           
                   })        
		}      
    },      
    fail: function (res) { },//接口调用失败的回调函数      
    complete: function (res) { },//接口调用结束的回调函数(调用成功、失败都会执行)   
})

效果展示:
在这里插入图片描述
三、选择菜单:

wx.showActionSheet({
         itemList: ['点赞', '收藏', '看过'],//显示的列表项
         success: function (res) {//res.tapIndex点击的列表项
            console.log("点击了列表项:" + that[res.tapIndex])
         },
         fail: function (res) { },
         complete:function(res){ }
      })

效果展示:
在这里插入图片描述

发布了7 篇原创文章 · 获赞 5 · 访问量 759

猜你喜欢

转载自blog.csdn.net/qq_44632227/article/details/104113397