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

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

<view   bindtap="toClock" data-id="{{item.contentdesc}}">查看详情</view>

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

<modal hidden="{{hiddenmodalput}}" title="详细介绍" confirm-text="提交" cancel-text="取消" bindcancel="cancel" bindconfirm="confirm">
    <input type='text'  value="{{num}}"     bindinput='tdate'  auto-focus/>
 </modal>

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

data: {
    hiddenmodalput:true
  },

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

 //弹框
  toClock(e){
 var that=this
 var num="123"
    that.setData({
      num:num,
      hiddenmodalput: !this.data.hiddenmodalput
   })
  },

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

 //取消按钮
 cancel: function(){
  this.setData({
      hiddenmodalput: true
  });
},
//确认
confirm: function(e){
  this.setData({
    hiddenmodalput: true
});
},

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