首页 > 其他分享 >van-dialog 点击confirm确定时如果不满足条件则不允许关闭

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

时间:2024-04-24 09:55:22浏览次数:29  
标签:return confirm 点击 done dialog van

    <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 () {

    },

 

标签:return,confirm,点击,done,dialog,van
From: https://www.cnblogs.com/dianzan/p/18154421

相关文章

  • 深入理解高级加密标准(Advanced Encryption Standard)
    title:深入理解高级加密标准(AdvancedEncryptionStandard)date:2024/4/2320:04:36updated:2024/4/2320:04:36tags:AES概述加密原理优势特点算法详解安全性应用实践案例分析第一章:AES概述AES的历史和背景历史: 高级加密标准(AdvancedEncryptionStandard,A......
  • Advanced .Net Debugging 1:你必须知道的调试工具
    Advanced.NetDebugging1:你必须知道的调试工具合集-Net高级调试(基于原著)(7) 1.Advanced.NetDebugging1:你必须知道的调试工具01-242.Advanced.NetDebugging2:CLR基础02-273.Advanced.NetDebugging3:基本调试任务(调试目标、符号、控制调试目标执行和设置断点)03-04......
  • Advanced .Net Debugging 7:托管堆与垃圾收集
    一、简介这是我的《Advanced.NetDebugging》这个系列的第七篇文章。这篇文章的内容是原书的第二部分的【调试实战】的第五章,这一章主要讲的是从根本上认识托管堆和垃圾回收。软件系统的内存管理方式有两种,第一种是手动管理内存,这种方式容易产生一些问题产生,比如:悬空指针......
  • wps使用FileDialog(msoFileDialogFolderPicker)问题解决
    在vba里面使用了WithApplication.FileDialog(msoFileDialogFolderPicker),在excel里面多次测试均正常,但在wps里面运行时,发现只有打开文档后第一次运行宏是正确的,之后运行就再取不到选取的单元格,不管怎么选取,.SelectedItems.Count都是0。百度搜索为什么。 找到两个帖子1、 ......
  • QT beginner QFileDialog
    QFileQTextStreamQMessageBoxQFileDialog应用示例mainwindow.cpp#include"mainwindow.h"#include"ui_mainwindow.h"#include<QFile>#include<QTextStream>#include<QMessageBox>#include<QFileDialog>MainWindow::MainWi......
  • vue3 + vant4 checkbox多选弹框
    实现效果代码如下多选组件DictSelect.vue<template><van-popup:show="showPicker"position="bottom":style="{height:'34vh'}"><divclass="con"><divclass="confirmBtns"&......
  • VantUI移动端适配
    VantUI的官方设计稿是320px,而设计稿普遍是750px,所以官方推荐配合postcss-pxtorem插件使用://eslint-disable-next-lineno-undefmodule.exports={plugins:[//eslint-disable-next-lineno-undefrequire('postcss-pxtorem')({rootValue({file}){......
  • Vant之日期选择BUG修复
    我连续使用两个Vant的日期组件,但是选中第一个日期组件的结果显示到第二个日期组件上了,HTML代码为:<divv-if="item.type==='date'&&!item.allowShowYearAndMonth"class="time"><van-field:label="item.label"v-model="mainFo......
  • 52 Things: Number 13: Outline the use and advantages of projective point represe
    52Things:Number13:Outlinetheuseandadvantagesofprojectivepointrepresentation.52件事:第13件:概述投影点表示的用途和优点。 Thisisthelatestinaseriesofblogpoststoaddressthelistof '52ThingsEveryPhDStudentShouldKnow' todoCryptogr......
  • dialog 中引用iframe, 通过iframe 调用 dialog 父页面方法
    父页面:<divid="ksbhif"><el-dialog:visible.sync="dialogVisible"title="开始备货"width="80%"top="50px"><iframe:src="iframeUrl"frameborder="0"width="100%"......