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

- .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的更多相关文章
- [组件封装]微信小程序-底部弹框
描述 模仿ios浏览器底部弹框效果. 遮罩层淡入淡出,弹框高度根据内容自适应. 效果 源码 popup-bottom.wxml <!-- popup-bottom.wxml --> < ...
- 微信小程序 --- model弹框
model弹框:在屏幕中间弹出,让你进行选择: 效果: 代码: <button type="primary" bindtap="btnclick"> ...
- 微信小程序底部弹框动画
在写小程序的时候,一般会碰到底部弹出动画,就像下面这样的效果 直接进入正题 https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-animation.ht ...
- 微信小程序之弹框modal
官方文档 <modal hidden="{{hidden}}" title="这里是title" confirm-text="自定义确定按钮&q ...
- 微信小程序下拉框组件
>>下拉组件 1.组件结构: 2.index.js: //index.js Component({ /** * 组件的属性列表 */ properties: { propArray: { ...
- [小程序开发] 微信小程序audio音频播放组件+api_wx.createAudioContext
引言: audio是微信小程序中的音频组件,可以轻松实现小程序中播放/停止音频等自定义动作. 附上微信小程序audio组件的相关属性说明:https://mp.weixin.qq.com/debug/ ...
- 微信小程序页面调用自定义组件内的事件
微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...
- 微信小程序(二十)-UI组件(Vant Weapp)-01按装配置
1.官网 https://vant-contrib.gitee.io/vant-weapp/#/intro https://gitee.com/vant-contrib/vant-weapp 2.按装 ...
- 小程序 模态对话框自定义组件(modal)
1. 概述 1.1 说明 小程序中使用wx.showModal(Object object)打开一个模态对话框,但是目前小程序所提供的modal中的内容显示比较死板,不能够完全满足工作中所遇到的功能信 ...
随机推荐
- CodeForces--TechnoCup--2016.10.15--ProblemA--Transformation: from A to B
http://codeforces.com/contest/727/problem/A Transformation: from A to B time limit per test 1 second ...
- CentOS下编译安装Apache(httpd)
官网下载最新版本的apache, apr, apr-util http://httpd.apache.org/download.cgi#apache24 http://apr.apache.org/d ...
- 转:Ant使用指南
一.概述 ant 是一个将软件编译.测试.部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发.在实际软件开发中,有很多地方可以用到ant. 开发环境: System:Windo ...
- HDU 5718 Oracle
如果非零的数小于等于1个,则无解.否则有解. 取出一个最小的非零的数作为一个数,剩下的作为一个数,相加即可. #include<cstdio> #include<cstring> ...
- meta--------link
<meta http-equiv="refresh" content="20">//每二十秒刷新一次页面: <meta http-equiv= ...
- centos搭建nginx环境
1.yum install pcre* 2.wget http://nginx.org/download/nginx-1.7.8.tar.gz 3.tar -zxvf nginx-1.7.8.tar ...
- 关于自定义jar包(tomcat)的添加
1 鼠标右击工程 选择 properties 或者 Ait + Enter 2 选择Libraries 3 点击Add Library... 4 选择User Library 点击 Next 5 如 ...
- Html 中表单提交的一些知识总结——防止表单自动提交,以及submit和button提交表单的区别
转自:http://jackaudrey.blog.163.com/blog/static/1314217882010590041833/ 在页面中有多个input type="text&q ...
- HQL中左连接,右连接,内连接
左连接:left join 如A left join B 即取出A表的所有数据,由on条件关联的B表数据,有则显示,没有则为空: 右连接:right join 如 A right join B 即取出 ...
- src和href的区别
<html><!--头部标签--><!--src和href的区别src:引用,该资源是页面不可缺少的一部分,如(img标签 video标签 radio标签);href:引 ...