微信小程序——提示弹窗wx.showModal
先在.wxml里面写好布局文件,这里拿删除按钮作为示例:
<!-- 删除按钮 -->
<view class="buttonView">
<text class="delete_button" bindtap="delete" data-index="{
{index}}">删除</text>
</view>
这里解释一下,点击事件用bindtap,delete是需要在.js文件里写的点击事件方法。bindtap="delete"是布局文件中删除按钮与.js文件里的删除方法绑定。下面看下.js里面删除方法,弹窗是在点击删除的时候弹出的,所以写在删除事件里面了:
// 删除按钮点击事件
delete:function(e){
// 提示框
wx.showModal({
title: 提示,
content: 确定删除?,
success: function (res) {
if (res.confirm) {
console.log(确定)
} else {
console.log(取消)
}
}
})
},
下面对提示框用到的各属性做下解释:
title:提示标题;
content:提示内容;
showCancel:是否显示取消按钮;
cancelText:取消按钮的文字,最多 4 个字符;
cancelColor:取消按钮的文字颜色,必须是 16 进制格式的颜色字符串;
confirmText:确认按钮的文字,最多 4 个字符;
confirmColor:确认按钮的文字颜色,必须是 16 进制格式的颜色字符串;
success:调用成功的回调函数;
res.confirm: 为 true 时,表示用户点击了确定按钮;
res.cancel:为 true 时,表示用户点击了取消(用于 Android 系统区分点击蒙层关闭还是点击取消按钮关闭);
上一篇:
uniapp开发微信小程序-2.页面制作
下一篇:
微信公众号开发流程指南
