一、直接上代码!--test.wxml--viewbuttonbindtap="popSuccessTest"成功提示弹窗/buttonbuttonbindtap="popMaskTest"带透明蒙层的弹窗/buttonbuttonbindtap="popTest"纯文字弹窗/buttonbuttonbindtap="popCustomIcon"自定义图标/buttonbuttonbindtap="popConfirm"confirm的弹窗/buttonbuttonbindtap="popLoading"加载弹窗/buttonbuttonbindtap="popSelect"选择框弹窗/button/view//test.jsPage({popSuccessTest:function(){wx.showToast({title:'成功提示弹窗',icon:'',//默认值是success,就算没有icon这个值,就算有其他值最终也显示successduration:2000,//停留时间})},popMaskTest:function(){wx.showToast({title:'带蒙层的弹窗',duration:2000,mask:true//是否有透明蒙层,默认为false//如果有透明蒙层,弹窗的期间不能点击文档内容})},popTest:function(){wx.showToast({title:'纯文字弹窗',icon:'none',//如果要纯文本,不要icon,将值设为'none'duration:2000})},popCustomIcon:function(){wx.showToast({title:'自定义图标弹窗',image:'../../static/image/icon.png',//image的优先级会高于iconduration:2000})},popConfirm:function(){wx.showModal({title:'confirm的弹窗',content:'确认要删除该项吗?',success:function(res){if(res.confirm){console.log('点击确认回调')}else{console.log('点击取消回调')}}})},popLoading:function(){wx.showLoading({title:'加载中...'});},popSelect:function(){wx.showActionSheet({itemList:['A','B','C'],success:function(res){console.log(res);}})}});实现效果:







二、重点解析①、wx.showToast中比较重要的属性
title:'弹窗文字内容',
icon:弹窗图标默认值是success,当没有这个属性时,或者当值为'',或者为其他值时(设置了error,warning都无效)都最终为success。如果要纯文本,不要icon,将值设为'none'
image:自定义图标,image的优先级会高于icon
duration:弹窗停留时间,
mask:是否有透明蒙层,默认为false,如果有透明蒙层,弹窗的期间不能点击弹窗后面的文档内容
②、wx.showLoading注意点
使用wx.showLoading触发的弹窗,需要用wx.hideLoading()来关闭。













