微信小程序例子——使用modal组件弹出对话框
1、效果展示
2、关键代码
1、index.wxml
提示：{
{tip}}
点击我弹出modal对话框
您好，我是modal对话框 提示：{ {tip}} 点击我弹出modal对话框 您好，我是modal对话框
2、index.js
Page({
data:{
// text:"这是一个页面"
tip:,
buttonDisabled:false,
modalHidden:true,
show:false
},
showModal:function(){
this.setData({
modalHidden:!this.data.modalHidden
})
},
modalBindaconfirm:function(){
this.setData({
modalHidden:!this.data.modalHidden,
show:!this.data.show,
tip:您点击了【确认】按钮！,
buttonDisabled:!this.data.buttonDisabled
})
},
modalBindcancel:function(){
this.setData({
modalHidden:!this.data.modalHidden,
tip:您点击了【取消】按钮！
})
}
}) Page({ data:{ // text:"这是一个页面" tip:, buttonDisabled:false, modalHidden:true, show:false }, showModal:function(){ this.setData({ modalHidden:!this.data.modalHidden }) }, modalBindaconfirm:function(){ this.setData({ modalHidden:!this.data.modalHidden, show:!this.data.show, tip:您点击了【确认】按钮！, buttonDisabled:!this.data.buttonDisabled }) }, modalBindcancel:function(){ this.setData({ modalHidden:!this.data.modalHidden, tip:您点击了【取消】按钮！ }) } })
3、源代码获取方式 3、源代码获取方式
百度云链接：http://pan.baidu.com/s/1kUZea7l 百度云链接：http://pan.baidu.com/s/1kUZea7l
5、觉得不错请打赏，您的十分满意是笔者的无限动力。
5、觉得不错请打赏，您的十分满意是笔者的无限动力。
上一篇：
uniapp开发微信小程序-2.页面制作
下一篇：
微信小程序实现动态检索功能