微信小程序  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 相关文章推荐
JavaScript 创建运动框架的实现代码
May 08 Javascript
jQuery 淡出一个图像到另一个图像的实现代码
Jun 12 Javascript
jquery提取元素里的纯文本不包含span等里的内容
Sep 30 Javascript
JavaScript 事件绑定及深入
Apr 13 Javascript
详解JavaScript中shift()方法的使用
Jun 09 Javascript
JS 日期与时间戮相互转化的简单实例
Jun 22 Javascript
vue router学习之动态路由和嵌套路由详解
Sep 21 Javascript
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
javascript验证form表单数据的案例详解
Mar 25 Javascript
微信小程序用户登录和登录态维护的实现
Dec 10 Javascript
游戏开发中如何使用CocosCreator进行音效处理
Apr 14 Javascript
Element-ui Layout布局(Row和Col组件)的实现
Dec 06 Vue.js
从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开发GUI
2006/10/09 PHP
php数组函数序列之array_key_exists() - 查找数组键名是否存在
2011/10/29 PHP
PHP数组 为文章加关键字连接 文章内容自动加链接
2011/12/29 PHP
php生成百度sitemap站点地图类函数实例
2014/10/17 PHP
ThinkPHP实现动态包含文件的方法
2014/11/29 PHP
PHP基于文件存储实现缓存的方法
2015/07/20 PHP
php生成图片验证码的方法
2016/04/15 PHP
php写app用的框架整理
2019/09/29 PHP
类之Prototype.js学习
2007/06/13 Javascript
js ondocumentready onmouseover onclick onmouseout 样式
2010/07/22 Javascript
JS 实现完美include载入实现代码
2010/08/05 Javascript
javascript下利用arguments实现string.format函数
2010/08/24 Javascript
$.format,jquery.format 使用说明
2011/07/13 Javascript
firefox下jquery ajax返回object XMLDocument处理方法
2014/01/26 Javascript
值得分享的Bootstrap Ace模板实现菜单和Tab页效果
2015/12/30 Javascript
Javascript基于对象三大特性(封装性、继承性、多态性)
2016/01/04 Javascript
基于JavaScript代码实现随机漂浮图片广告
2016/01/05 Javascript
详解webpack3如何正确引用并使用jQuery库
2017/08/26 jQuery
vue移动端实现红包雨效果
2020/06/23 Javascript
微信小程序登录数据解密及状态维持实例详解
2019/05/06 Javascript
微信小程序地图绘制线段并且测量(实例代码)
2020/01/02 Javascript
基于JavaScript实现随机点名器
2021/02/25 Javascript
python下如何查询CS反恐精英的服务器信息
2017/01/17 Python
Python+matplotlib+numpy实现在不同平面的二维条形图
2018/01/02 Python
python实现本地图片转存并重命名的示例代码
2018/10/27 Python
html5中canvas学习笔记2-判断浏览器是否支持canvas
2013/01/06 HTML / CSS
巴西电子产品购物网站:Saldão da Informática
2018/01/09 全球购物
英国马匹装备和马术用品购物网站:Equine Superstore
2019/03/03 全球购物
Aeropostale官网:美国著名校园品牌及青少年服饰品牌
2019/03/21 全球购物
分公司任命书
2014/06/06 职场文书
搞笑车尾标语
2014/06/23 职场文书
平面设计专业求职信
2014/08/09 职场文书
竞聘自述材料
2014/08/25 职场文书
护士长2014年度工作总结
2014/11/11 职场文书
python正则表达式re.search()的基本使用教程
2021/05/21 Python
mysql 索引合并的使用
2021/08/30 MySQL