Vant-ui组件 Dialog里的before-close阻止关闭

vant v2版本的官网中,怎样使用该API写的很粗!

action:当 action === "confirm" 表示点击 确定 按钮,反之点击 取消
done:控制是否关闭弹窗 done()关闭弹窗,done(false)阻止关闭弹窗

⭐示例代码

    <van-dialog
      v-model="isShowPwd"
      title="修改密码"
      show-cancel-button
      :before-close="onBeforeClose" // 绑定onBeforeClose事件
    >
async onBeforeClose(action, done) {
      if (action === "confirm") { // 点击确定走这里
        if (this.username && this.password) {
         // 登录成功
        } else {
          // 登录失败,阻止弹窗关闭 
          // done()里可以放true和false来控制
          return done(false) // 阻止弹窗关闭
        }
      } else { // 点击取消走这里
        done(true) // 关闭弹窗, true可以省略
      }
    }
  • 13
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 8
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值