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的更多相关文章

  1. [组件封装]微信小程序-底部弹框

    描述 模仿ios浏览器底部弹框效果. 遮罩层淡入淡出,弹框高度根据内容自适应. 效果 源码 popup-bottom.wxml <!-- popup-bottom.wxml --> < ...

  2. 微信小程序 --- model弹框

    model弹框:在屏幕中间弹出,让你进行选择: 效果: 代码: <button type="primary" bindtap="btnclick"> ...

  3. 微信小程序底部弹框动画

    在写小程序的时候,一般会碰到底部弹出动画,就像下面这样的效果 直接进入正题 https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-animation.ht ...

  4. 微信小程序之弹框modal

    官方文档 <modal hidden="{{hidden}}" title="这里是title" confirm-text="自定义确定按钮&q ...

  5. 微信小程序下拉框组件

    >>下拉组件 1.组件结构: 2.index.js: //index.js Component({ /** * 组件的属性列表 */ properties: { propArray: { ...

  6. [小程序开发] 微信小程序audio音频播放组件+api_wx.createAudioContext

    引言: audio是微信小程序中的音频组件,可以轻松实现小程序中播放/停止音频等自定义动作. 附上微信小程序audio组件的相关属性说明:https://mp.weixin.qq.com/debug/ ...

  7. 微信小程序页面调用自定义组件内的事件

    微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...

  8. 微信小程序(二十)-UI组件(Vant Weapp)-01按装配置

    1.官网 https://vant-contrib.gitee.io/vant-weapp/#/intro https://gitee.com/vant-contrib/vant-weapp 2.按装 ...

  9. 小程序 模态对话框自定义组件(modal)

    1. 概述 1.1 说明 小程序中使用wx.showModal(Object object)打开一个模态对话框,但是目前小程序所提供的modal中的内容显示比较死板,不能够完全满足工作中所遇到的功能信 ...

随机推荐

  1. Chrome 43+浏览器 Cookies encrypted_value解密脚本

    python 3.3.5 # -*- coding: utf-8 -*- # Used information from: # http://stackoverflow.com/questions/4 ...

  2. css单独设定样式

    <style type="text/css"> #footer { position: fixed; bottom: 0; } .td-right{ border-ri ...

  3. css float left right 中间空间城数据无法显示

    css float left right 中间空间城数据无法显示 是由于设定了width具体值太小造成,简单用%值或不设置.

  4. 转 区别 getChildFragmentManager getSupportFragmentManager

    The definition of getChildFragmentManager() is: Return a private FragmentManager for placing and man ...

  5. 用Eclipse 统计代码行数小技巧

    今天公司SQA问我目前项目代码行数有多少,我当时就是想,以前好像写过类似的统计工具但是一时又找不到 公司网络又不能下载,所以想想eclipse是不是又类似功能,找了下没有,但突然一想有一个转弯方法:统 ...

  6. javascript event bubbling and capturing (再谈一谈js的事件冒泡和事件补获,看到这篇文章加深了理解)

    原文地址:http://javascript.info/tutorial/bubbling-and-capturing 先给出最终的结论: Summary Events first are captu ...

  7. Ubuntu下安装Hudson

    因为hudson需要依赖java等,手动安装比较费劲 官方给出了一种很简单的解决方案:http://wiki.eclipse.org/Hudson-ci/Installing_Hudson_DEB 1 ...

  8. 在Window平台下安装xgboost的Python版本

    原文:http://blog.csdn.net/pengyulong/article/details/50515916 原文修改了两个地方才安装成功,第3步可以不用,第2步重新生成所有的就行了. 第4 ...

  9. 16级第一周寒假作业F题

    Subsequence TimeLimit:1000MS  MemoryLimit:65536K 64-bit integer IO format:%lld Problem Description A ...

  10. 签名“未签名”apk文件命令

    在发布至360.oppo应用市场时分别遇到了需要"应用加固"和"应用认领"的情况, 流程都是需要下载一个未签名的apk文件(安装包),然后签名后再上传. 我的做 ...