小程序弹框demo

2019-05-20  本文已影响0人  寻找大海的鱼

一.index.wxml代码

<view class="container">
  <modal hidden="{{hidden}}" title="测试弹框" cancel-text="关闭" bindcancel="cancel" bindconfirm="confirm" no-cancel="{{nocancel}}">
    123
  </modal>
</view>

二.index.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");
  }
})

三.演示结果
1.点击关闭,弹框消失


close.png
closeResult.png

2.点击确定,关闭按钮消失


confirm.png
confirmResult.png
上一篇下一篇

猜你喜欢

热点阅读