微信小程序之----弹框组件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中的内容显示比较死板,不能够完全满足工作中所遇到的功能信 ...
随机推荐
- java 设计模式之单利模式以及代理模式(静态)
1:单利模式: public class Singleton { private static Singleton uniqueInstance = null; private Singleton() ...
- Modis 陆地产品格网
Technorati 标签: Modis,陆地产品,格网
- 编辑距离算法详解:Levenshtein Distance算法
算法基本原理:假设我们可以使用d[ i , j ]个步骤(可以使用一个二维数组保存这个值),表示将串s[ 1…i ] 转换为 串t [ 1…j ]所需要的最少步骤个数,那么,在最基本的情况下,即在i等 ...
- CodeForces 678D Iterated Linear Function
简单矩阵快速幂. #include<cstdio> #include<cstring> #include<cmath> #include<algorithm& ...
- 设置批量商品优惠、如何修改ZenCart产品显示图片的大小
利用下面的方法,可以实现: 买一送一.买一件第二件5折.买三件优惠10%等功能. 管理页面 - 商品管理 - 价格管理 - (选择商品) - 编辑 - 添加空白折扣. 应用上面的办法,能够完成:买一送 ...
- Win下安装Cygwin中的SSH服务
windows和linux各有其优越性,可以安装在同一台电脑上,但切换要重启.同时拥有两台电脑,一台装win,一台装linux,自然非常好,但具备此条件的不多.本文介绍cygwin,它可以让你在win ...
- css脱离文档流
作者:张秋怡链接:http://www.zhihu.com/question/24529373/answer/29135021来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出 ...
- 玩Mega8 智能充电器-12. 终于实现-dV检测(转)
源:http://blog.chinaunix.net/uid-10701701-id-91873.html 2010.1.3 5:30终于补齐了. 电池充电的-dv 的检测系列图片请移步: http ...
- string 与wstring 的转换
std::wstring StringToWString(const std::string &str) { std::wstring wstr(str.length(),L' '); std ...
- Matplotlib中文显示的问题
原文地址:http://blog.csdn.net/rumswell/article/details/6544377 #Matplotlib中文显示有问题,当然可以修改配置文件matplotlibrc ...