微信小程序弹框显示自定义内容（1）

1：通过查看详情绑定函数toClock
toClock 触发弹框

查看详情
1

2：准备model模块
model放在需要触发按钮同样的文件wxxml即可

1
2
3

hidden=“{{hiddenmodalput}}”
hiddenmodalput这个控制弹框显示或消失
默认消失也就是关闭的，所以在js文件data设置

data: {
    hiddenmodalput:true
  },
1
2
3

input即显示文件内容
3：toClock函数
将num显示在弹框里

 //弹框
  toClock(e){
 var that=this
 var num="123"
    that.setData({
      num:num,
      hiddenmodalput: !this.data.hiddenmodalput
   })
  },
1
2
3
4
5
6
7
8
9

4：确认和取消
点击会实现弹框的消失（想实现更多的内容可在取消确认自己写函数）

 //取消按钮
 cancel: function(){
  this.setData({
      hiddenmodalput: true
  });
},
//确认
confirm: function(e){
  this.setData({
    hiddenmodalput: true
});
},
1
2
3
4
5
6
7
8
9
10
11
12

关于微信弹框更多知识微信搜索公众号：小白XBIT