微信小程序  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 相关文章推荐
js checkbox(复选框) 使用集锦
Apr 28 Javascript
Javascript 日期处理之时区问题
Oct 08 Javascript
js获取图片长和宽度的代码
Nov 24 Javascript
jQuery 图片切换插件(代码比较少)
May 07 Javascript
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
Aug 30 Javascript
一波JavaScript日期判断脚本分享
Mar 06 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
JSON与String互转的实现方法(Javascript)
Sep 27 Javascript
简单实现IONIC购物车功能
Jan 10 Javascript
详解关于html,css,js三者的加载顺序问题
Apr 10 Javascript
Vue实战教程之仿肯德基宅急送App
Jul 19 Javascript
JavaScript文档加载模式以及元素获取
Jul 28 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 输出简单动态WAP页面
2009/06/09 PHP
PHP COOKIE及时生效的方法介绍
2014/02/14 PHP
PHP实现生成模糊图片的方法示例
2017/12/21 PHP
在网页中使用document.write时遭遇的奇怪问题
2010/08/24 Javascript
基于Jquery实现表格动态分页实现代码
2011/06/21 Javascript
JavaScript使用HTML5的window.postMessage实现跨域通信例子
2014/04/11 Javascript
jquery实现实时改变网页字体大小、字体背景色和颜色的方法
2015/08/05 Javascript
简单封装js的dom查询实例代码
2016/07/08 Javascript
Bootstrap表单布局
2016/07/19 Javascript
jQuery实现判断控件是否显示的方法
2017/01/11 Javascript
浅谈vue的踩坑路
2017/08/31 Javascript
详解JSON和JSONP劫持以及解决方法
2019/03/08 Javascript
详解利用eventemitter2实现Vue组件通信
2019/11/04 Javascript
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
2019/11/18 jQuery
详解React 条件渲染
2020/07/08 Javascript
[40:48]DOTA2上海特级锦标赛D组败者赛 Liquid VS COL第二局
2016/02/28 DOTA
Python中模块pymysql查询结果后如何获取字段列表
2017/06/05 Python
彻底搞懂Python字符编码
2018/01/23 Python
Python实现的redis分布式锁功能示例
2018/05/29 Python
python初学者,用python实现基本的学生管理系统(python3)代码实例
2019/04/10 Python
Pandas 重塑(stack)和轴向旋转(pivot)的实现
2019/07/22 Python
python matplotlib库绘制散点图例题解析
2019/08/10 Python
Python实现代码统计工具
2019/09/19 Python
通过 Python 和 OpenCV 实现目标数量监控
2020/01/05 Python
python实现数字炸弹游戏
2020/07/17 Python
python 实现超级玛丽游戏
2020/11/25 Python
简单介绍Object类的功能、常用方法
2013/10/02 面试题
请解释在new与override的区别
2012/10/29 面试题
文秘人员工作职责
2014/01/31 职场文书
策划创业计划书
2014/02/06 职场文书
《小石潭记》教学反思
2014/02/13 职场文书
2014全年工作总结
2014/11/27 职场文书
2015年文员个人工作总结
2015/04/09 职场文书
现场施工员岗位职责
2015/04/11 职场文书
安全责任协议书范本
2016/03/23 职场文书
swagger如何返回map字段注释
2021/07/03 Java/Android