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. magento模板中XML与phtml关系 [四]

    layout\catalogserch.xml 中声明的 as="topSearch" 被templ\page\html\header.phtml调用输出 echo $this-& ...

  2. SEO优化之 主页上加上nofollow

    <a href=http://www.主页.cn/ rel=”nofollow”>这里是锚文字</a> <光年日志分析系统>来分析抓取比较多的是哪个网页,没用的no ...

  3. Junit单元测试的简单使用(主要是在spring框架下的项目)

    首先是解释什么是单元测试,单元测试是指对于一个大型项目里,对于单一模块或者单一接口的测试. 然后解释为什么要写单元测试,首先对于一个大型的项目,如果你每次都要重启一遍服务器调页面或者接口的bug,那就 ...

  4. 彻底搞明白find命令的-mtime参数的含义【转载】

    转自: 彻底搞明白find命令的-mtime参数的含义-goolen-ITPUB博客http://blog.itpub.net/23249684/viewspace-1156932/ 以前一直没有弄明 ...

  5. JSP标签编程--简单标签

    javax.servlet.jsp.tagext里的类SimpleTagSupport 使用SimpleTagSupport类一网打尽以往复杂的标签开发,直接使用doTag()方法 java文件: p ...

  6. winxp iis5中修改最大连接数及添加多个站点

    winxp iis5中修改最大连接数及添加多个站点 最 近用asp做一些东西,需要用到iis,还需要用photoshop做一些图片.以前都是在win2003下面做,可是photoshop里面很多中文字 ...

  7. 加密Web.Config配置文件

    protected void btnPassWord_Click(object sender, EventArgs e) { //加密 Configuration config = WebConfig ...

  8. 蛙人(ple)

    蛙人(ple) 题目描述 蛙人使用特殊设备潜水.设备中有一个气瓶,分两格:一格装氧气,另一格装氮气.留在水中有时间的限制,在深水中需要大量的氧气与氮气.为完成任务,蛙人必须安排好气瓶.每个气瓶可以用它 ...

  9. ide编码害死人

    1.从网上复制代码的时候不要直接复制代码到ide中(MyEclipse,Eclipse)中这样在一般的情况下就没问题,但是在有编码规则的时候需要特别的小心,建议先复制到本地的txt文件中,然后在复制到 ...

  10. PAT (Advanced Level) 1091. Acute Stroke (30)

    BFS求连通块.递归会爆栈. #include<cstdio> #include<cstring> #include<cmath> #include<algo ...