主要分为四种弹窗:
一、showToast('普通弹出窗')
wx.showToast(){ title:'提示文本' }
在showToast中: title是必填的属性;
duration:显示时间(默认1500毫秒)
icon:显示图标 ------》 一个有三个参数: 1.success 2.loading 3.none 其中success是默认值,loading就是加载的样式,none则是不显示图标
image:“图片路径” ------》 自定义显示图标;
mask:true 添加遮罩层(默认false)
二、showModal (‘类似于confirm弹出框’)
wx.showModal({ title:'你好哇' content:'非常好吧 ' })
在showModal中: 没有必填属性;
title:弹出框标题
content:文本内容
showCancel:true 是否显示取消按钮(默认值是true)
cancelText:"内容" 取消按钮显示的文字(最大4个字符)
cancelColor:'颜色' 取消按钮的颜色
confirmText:"内容" 确认按钮显示的文字(最大4个字符)
confirmColor:'颜色' 确认按钮显示的颜色
success:res=>{
if(res.confirm){
console.log('用户点击了确认按钮')
}else if(!res.confirm){
console.log('用户点击了取消按钮')
}
})
三、showLoading(加载弹出框)
wx.showLoading({ title:'文本内容' }) 在showLoading中:title是必填属性 mask:遮罩层 默认为false success:()=>{ console.log('触发成功') } showLoading 效果类似于toast中icon等于loading的效果, 区别是:toast有时间限制,而showLoading中没有时间限制 只有调用hideLoading()方法 才可以关掉 该弹出框一般用于网络请求时,当请求成功时,调用hideLoading()
四、showActionSheet(从下方弹出的选择框)
wx.showActionSheet({ itemList:['相册','拍照'] }) 在showActionSheet中:itemList是必填属性(填写类型是String) itemColor:改变按钮文字颜色 success:res=>{ console.log(res) //res.tapIndex:获取到点击的数组下标可以通过switch进行监听 switch(res.tapIndex){ case 0: console.log('用户选择了相册') break; default: break; } }