微信小程序  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 相关文章推荐
3Z版基于jquery的图片复选框(asp.net+jquery)
Apr 12 Javascript
单独使用CKFinder选择图片的方法
Aug 21 Javascript
jQuery 图片切换插件(代码比较少)
May 07 Javascript
JavaScript编程学习技巧汇总
Feb 21 Javascript
弹出遮罩层后禁止滚动效果【实现代码】
Apr 29 Javascript
WebView启动支付宝客户端支付失败的问题小结
Jan 11 Javascript
Vue.js -- 过滤器使用总结
Feb 18 Javascript
JS检测数组类型的方法小结
Mar 14 Javascript
详解vue-cli 快速搭建单页应用之遇到的问题及解决办法
Mar 01 Javascript
jQuery实现动态加载select下拉列表项功能示例
May 31 jQuery
layui radio点击事件实现input显示和隐藏的例子
Sep 02 Javascript
JS localStorage存储对象,sessionStorage存储数组对象操作示例
Feb 15 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实现智能文件类型检测的实现代码
2011/08/02 PHP
Yii的Srbac插件用法详解
2016/07/14 PHP
PHP面向对象之事务脚本模式(详解)
2017/06/07 PHP
php session_decode函数用法讲解
2019/05/26 PHP
PHP pthreads v3下同步处理synchronized用法示例
2020/02/21 PHP
使用jquery.qrcode生成彩色二维码实例
2014/08/08 Javascript
javascript制作sql转换为stringBuffer的小工具
2015/04/03 Javascript
JavaScript深度复制(deep clone)的实现方法
2016/02/19 Javascript
jQuery事件与动画基础详解
2017/02/23 Javascript
强大的JavaScript响应式图表Chartist.js的使用
2017/09/13 Javascript
layer弹出层全屏及关闭方法
2018/08/17 Javascript
命令行批量截图Node脚本示例代码
2019/01/25 Javascript
微信小程序JS加载esmap地图的实例详解
2019/09/04 Javascript
通过layer实现可输入的模态框的例子
2019/09/27 Javascript
浅析JS中NEW的实现原理及重写
2020/02/20 Javascript
Python通过poll实现异步IO的方法
2015/06/04 Python
python数组过滤实现方法
2015/07/27 Python
安装docker-compose的两种最简方法
2019/07/30 Python
python中如何实现将数据分成训练集与测试集的方法
2019/09/13 Python
python 读取.nii格式图像实例
2020/07/01 Python
详解如何在pyqt中通过OpenCV实现对窗口的透视变换
2020/09/20 Python
html table呈现个人简历以及单元格宽度失效的问题解决
2021/01/22 HTML / CSS
小区门卫工作职责
2013/12/14 职场文书
数控专业大学毕业生职业规划范文
2014/02/06 职场文书
气象学专业个人求职信
2014/04/22 职场文书
建设单位项目负责人任命书
2014/06/06 职场文书
微笑服务标语
2014/06/24 职场文书
基层领导干部“四风”问题批评与自我批评
2014/09/23 职场文书
公民授权委托书
2014/10/15 职场文书
小学国庆节活动总结
2015/03/23 职场文书
建国大业电影观后感
2015/06/01 职场文书
2015国庆节放假通知范文
2015/07/30 职场文书
分享:关于学习的励志名言赏析
2019/08/16 职场文书
《中华上下五千年》读后感3篇
2019/11/29 职场文书
深入理解Pytorch微调torchvision模型
2021/11/11 Python
进行数据处理的6个 Python 代码块分享
2022/04/06 Python