课程表

微信小程序框架

微信小程序组件

微信小程序API

微信小程序开放接口

微信小程序工具

微信小程序设计规范

工具箱
速查手册

小程序 对话框 modal

当前位置:免费教程 » 移动开发 » 微信小程序

注意:

modal即将废弃,请使用 API wx.showModal



对话弹窗

属性名 类型 默认值 说明
title String   标题
hidden Boolean false 是否隐藏整个弹窗
no-cancel Boolean false 是否隐藏cancel按钮
confirm-text String 确定 confirm按钮文字
cancel-text String 取消 cancel按钮文字
bindconfirm EventHandle   点击确认触发的回调
bindcancel EventHandle   点击取消以及蒙层触发的回调

示例:

  1. <modal title="标题" confirm-text="confirm" cancel-text="cancel" hidden="{{modalHidden}}" bindconfirm="modalChange" bindcancel="modalChange">
  2. 这是对话框的内容。
  3. </modal>
  4.  
  5. <modal class="modal" hidden="{{modalHidden2}}" no-cancel bindconfirm="modalChange2">
  6. <view> 没有标题没有蒙层没有确定的modal </view>
  7. <view> 内容可以插入节点 </view>
  8. </modal>
  9.  
  10. <view class="btn-area">
  11. <button type="default" bindtap="modalTap">点击弹出modal</button>
  12. <button type="default" bindtap="modalTap2">点击弹出modal2</button>
  13. </view>
  1. Page({
  2. data: {
  3. modalHidden: true,
  4. modalHidden2: true
  5. },
  6. modalTap: function(e) {
  7. this.setData({
  8. modalHidden: false
  9. })
  10. },
  11. modalChange: function(e) {
  12. this.setData({
  13. modalHidden: true
  14. })
  15. },
  16. modalTap2: function(e) {
  17. this.setData({
  18. modalHidden2: false
  19. })
  20. },
  21. modalChange2: function(e) {
  22. this.setData({
  23. modalHidden2: true
  24. })
  25. },
  26. })

modal

 


注意:

modal即将废弃,请使用 API wx.showModal

转载本站内容时,请务必注明来自W3xue,违者必究。
 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号