van-dialog 点击confirm确定时如果不满足条件则不允许关闭

复制代码
    <van-dialog
      v-model="showDialog"
      @confirm="confirmFn"
      @cancel="showDialog = false"
      title="添加故障现象"
      show-cancel-button
      :before-close="onBeforeClose"
    >
      <div class="p10">
        <van-field
          v-model="faultPhenomenon"
          placeholder="请输入"
          clearable
          :rules="[{ required: true, message: '请输入故障现象' }]"
        />
      </div>
    </van-dialog>
复制代码
复制代码
    onBeforeClose (action, done) {
      // 点击了确定按钮
      if (action === "confirm") {
        if (this.faultPhenomenon == '') {
          this.$toast.fail('请输入故障现象');
          return
        }
        // if()...也可以加入一些条件
        return done(false);//直接return它即可阻止
      }
      // 点击了取消按钮
      else {
        done(true); //关闭弹窗, true可以省略
      }
    },
    // 确定添加故障现象
    confirmFn () {

    },
复制代码

 

posted @   ThisCall  阅读(1513)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· winform 绘制太阳,地球,月球 运作规律
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
历史上的今天:
2022-04-24 浏览器es6报错 babel-plugin-transform-runtime 引入 代替babel-polyfill
2020-04-24 vue中使用 ESLint
2020-04-24 Vue组件的封装
2020-04-24 ESLint
2020-04-24 vue-devtools
2020-04-24 keep-alive
2020-04-24 vue路由懒加载
点击右上角即可分享
微信分享提示