微信小程序点击弹出输入框

微信小程序点击弹出输入框

第一次写博客，我决定不要太old school。
let’s get it！最近在学习微信开发，刚接触到微信小程序，自己尝试着做了一个简单的小程序，过程中发现类似web开发中的点击弹出模态输入框的功能不好实现，于是找了许多文章，最终是实现了这个little bin，话不多说，骡子牵出来：

需求很简单：点击编辑按钮可以编辑商家编号，上代码：
wxml：

<button class="delete">
 <text>删除</text>
   </button>
   <button class="edit" bindtap="modalinput">
     <text>编辑</text>
   </button>
   <modal hidden="{{hiddenmodalput}}" title="请输入商家编号" 
   			confirm-text="提交" cancel-text="取消" bindcancel="modalinput" 
   			bindconfirm="confirm">
     <!-- 这里可以自由选择你的输入框类型<input type='text' placeholder="请输入内容" auto-focus/> -->
     <textarea placeholder="请输入内容"></textarea>
   </modal>

接下来再给edit按钮指定一下modalinput点击事件就行了，而且这里取消也是绑定的modalinput事件额

js：

Page({
  data: {
  //初始化隐藏模态输入框
  hiddenmodalput: true,
  },
  modalinput: function () {
  this.setData({
  	//注意到模态框的取消按钮也是绑定的这个函数，
  	//所以这里直接取反hiddenmodalput，也是没有毛病
    hiddenmodalput: !this.data.hiddenmodalput
  })
}
})

看看效果：

嗯，还不错，至于后面的提交事件就是js写请求了，没有毛病

更多详情请点击这里：
https://www.jb51.net/article/149121.htm