微信小程序  modal弹框组件详解


Posted in Javascript onOctober 27, 2016

微信小程序  modal:

         这里对微信小程序中 modal组件进行详细解析,我想开发微信小程序的小伙伴可以用到,这里小编就记录下modal的知识要点。       

modal

modal类似于javascript中的confirm弹框,默认情况下是一个带有确认取消的弹框,不过点击取消后弹框不会自动隐藏,需要通过触发事件调用函数来控制hidden属性。

官方文档

微信小程序  modal弹框组件详解

.wxml

<modal hidden="{{hidden}}" title="这里是title" confirm-text="自定义确定按钮" cancel-text="自定义取消按钮" bindcancel="cancel" bindconfirm="confirm" no-cancel="{{nocancel}}">
  这是对话框的内容。
</modal>

.js

Page({
  data:{
    hidden:false,
    nocancel:false
  },
  cancel: function(){
    this.setData({
       hidden: true
    });
  },
  confirm: function(){
    this.setData({
       nocancel: !this.data.nocancel
    });  
    console.log("clicked confirm");
  }
})

运行效果

微信小程序  modal弹框组件详解

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
XRegExp 0.2: Now With Named Capture
Nov 30 Javascript
爆炸式的JS圆形浮动菜单特效代码
Mar 03 Javascript
Jquery阻止事件冒泡 event.stopPropagation
Dec 11 Javascript
将文本输入框内容加入表中的js代码
Aug 18 Javascript
JavaScript中数组继承的简单示例
Jul 29 Javascript
uploadify多文件上传参数设置技巧
Nov 16 Javascript
JavaScript+html5 canvas绘制渐变区域完整实例
Jan 26 Javascript
JavaScript中Form表单技术汇总(推荐)
Jun 26 Javascript
js 获取站点应用名的简单实例
Aug 18 Javascript
Javascript使用function创建类的两种方法(推荐)
Nov 19 Javascript
JS实现定时任务每隔N秒请求后台setInterval定时和ajax请求问题
Oct 15 Javascript
js中复选框的取值及赋值示例详解
Oct 18 Javascript
从0开始学Vue
Oct 27 #Javascript
微信小程序  Mustache语法详细介绍
Oct 27 #Javascript
利用JQuery直接调用asp.net后台的简单方法
Oct 27 #Javascript
JavaScript登录验证码的实现
Oct 27 #Javascript
微信小程序  自定义创建详细介绍
Oct 27 #Javascript
vue中渐进过渡效果实现
Oct 27 #Javascript
基于JS实现横线提示输入验证码随验证码输入消失(js验证码的实现)
Oct 27 #Javascript
You might like
php面向对象全攻略 (四)构造方法与析构方法
2009/09/30 PHP
PHP5中使用DOM控制XML实现代码
2010/05/07 PHP
php中的注释、变量、数组、常量、函数应用介绍
2012/11/16 PHP
php的ajax简单实例
2014/02/27 PHP
ThinkPHP实现动态包含文件的方法
2014/11/29 PHP
PHP获取网页所有连接的方法(附demo源码下载)
2016/03/30 PHP
非常实用的php验证码类
2016/05/15 PHP
PHP多维数组指定多字段排序的示例代码
2018/05/16 PHP
JQuery动画与特效实例分析
2015/02/02 Javascript
tuzhu_req.js 实现仿百度图片首页效果
2015/08/11 Javascript
基于JS实现PHP的sprintf函数实例
2015/11/14 Javascript
laypage分页控件使用实例详解
2016/05/19 Javascript
JavaScript实现获取用户单击body中所有A标签内容的方法
2017/06/05 Javascript
vue2组件之select2调用的示例代码
2017/10/12 Javascript
Element-ui tree组件自定义节点使用方法代码详解
2018/09/17 Javascript
基于element-ui组件手动实现单选和上传功能
2018/12/06 Javascript
详解js动态获取浏览器或页面等容器的宽高
2019/03/13 Javascript
如何使用CSS3+JQuery实现悬浮墙式菜单
2019/06/18 jQuery
jquery绑定事件 bind和on的用法与区别分析
2020/05/22 jQuery
vue axios请求成功却进入catch的原因分析
2020/09/08 Javascript
react-intl实现React国际化多语言的方法
2020/09/27 Javascript
Python文档生成工具pydoc使用介绍
2015/06/02 Python
python中abs&amp;map&amp;reduce简介
2018/02/20 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
CentOS7安装Python3的教程详解
2019/04/10 Python
Python切割图片成九宫格的示例代码
2020/03/10 Python
打印tensorflow恢复模型中所有变量与操作节点方式
2020/05/26 Python
python3列表删除大量重复元素remove()方法的问题详解
2021/01/04 Python
全球采购的街头服饰和帽子:Urban Excess
2020/10/28 全球购物
小区门卫工作职责
2013/12/14 职场文书
《盘古开天地》教学反思
2014/02/28 职场文书
2014年后备干部工作总结
2014/12/08 职场文书
先进集体申报材料
2014/12/25 职场文书
2015年世界无烟日演讲稿
2015/03/18 职场文书
读《解忧杂货店》有感:请相信一切都是最好的安排
2019/11/07 职场文书
导游词之绍兴柯岩古镇
2020/01/09 职场文书