脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → 微信小程序 modal

微信小程序 modal组件详细介绍

 更新时间：2016年09月28日 08:59:49   作者：顺子_RTFSC  
这篇文章主要介绍了微信小程序 modal组件详细介绍的相关资料,需要的朋友可以参考下

modal弹出框常用在提示一些信息比如：退出应用，清楚缓存，修改资料提交时一些提示等等。

常用属性：

wxml

<!--监听button点击事件-->
<button bindtap="listenerButton" type="primary">弹出modal</button>

<!--弹出框-->
<modal 
 title="退出应用"
  hidden="{{hiddenModal}}"
  confirm-text="再看看"
  cancel-text="退出"
  bindconfirm="listenerConfirm"
  bindcancel="listenerCancel" >
  您是否真的要退出应用
  </modal>

js

Page({
 data:{
 // text:"这是一个页面"
 hiddenModal: true
 },

 listenerButton:function() {
  this.setData({
   hiddenModal: !this.data.hiddenModal
  })
 },

 listenerConfirm:function() {
  this.setData({
   hiddenModal: true
  })
 },

 listenerCancel:function() {
  this.setData({
   hiddenModal: true
  })
 },

 onLoad:function(options){
 // 页面初始化 options为页面跳转所带来的参数
 },
 onReady:function(){
 // 页面渲染完成
 },
 onShow:function(){
 // 页面显示
 },
 onHide:function(){
 // 页面隐藏
 },
 onUnload:function(){
 // 页面关闭
 }
})

相关文章：

hello WeApp                      icon组件
Window                             text组件                                switch组件
tabBar底部导航                 progress组件                        action-sheet
应用生命周期                    button组件                            modal组件
页面生命周期                    checkbox组件                       toast组件
模块化详                           form组件详                            loading 组件
数据绑定                           input 组件                             navigator 组件
View组件                          picker组件                             audio 组件
scroll-view组件                 radio组件                              video组件
swiper组件                        slider组件                              Image组件

您可能感兴趣的文章:

相关文章

  • 微信小程序 swiper组件构建轮播图的实例

    微信小程序 swiper组件构建轮播图的实例

    这篇文章主要介绍了微信小程序 swiper组件构建轮播图的实例的相关资料,如有疑问请留言或者到本站社区交流讨论，需要的朋友可以参考下
    2017-09-09
  • javascript实现字典Dictionary示例基础

    javascript实现字典Dictionary示例基础

    这篇文章主要为大家介绍了javascript实现字典Dictionary基础示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-08-08
  • 微信小程序 request接口的封装实例代码

    微信小程序 request接口的封装实例代码

    这篇文章主要介绍了微信小程序 request接口的封装实例代码的相关资料,需要的朋友可以参考下
    2017-04-04
  • 一篇文章学会jsBridge的运行机制

    一篇文章学会jsBridge的运行机制

    JSBridge是一座用JavaScript搭建起来的桥，搭建这座桥的目的也很简单，让native可以调用web的js代码，让web可以 “调用” 原生的代码。本文主要通过分析源码讲解jsBridge的运行机制，感兴趣的朋友一起来看看吧
    2021-09-09
  • 微信小程序（十五）checkbox组件详细介绍

    微信小程序（十五）checkbox组件详细介绍

    这篇文章主要介绍了微信小程序checkbox组件详细介绍的相关资料,需要的朋友可以参考下
    2016-09-09
  • 一文解析Express框架view对象使用

    一文解析Express框架view对象使用

    这篇文章主要介绍了Express框架view对象使用解析，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-03-03
  • 深入内存原理谈JS中变量存储在堆中还是栈中

    深入内存原理谈JS中变量存储在堆中还是栈中

    JavaScript中基本类型存储在堆中还是栈中，百度一下有很多不同的答案，本篇文章就来给大家为此做个详细的介绍,需要的朋友可以参考一下
    2021-09-09
  • JS ES新特性 模板字符串

    JS ES新特性 模板字符串

    这篇文章主要介绍了JS ES新特性模板字符串,模板字符串即Template String是增强版的字符串，使用反引号(```)来代替谱通字符串中的用双引号和单引号,更多相关介绍,需要的朋友可以参考下面文章的详细内容
    2021-12-12
  • 前端自动化测试之Jest 进阶教程示例

    前端自动化测试之Jest 进阶教程示例

    这篇文章主要为大家介绍了前端自动化测试之Jest 进阶教程示例，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-02-02
  • js前端设计模式优化50%表单校验代码示例

    js前端设计模式优化50%表单校验代码示例

    这篇文章主要为大家介绍了js前端设计模式优化50%表单校验代码示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2022-06-06

最新评论