当前位置: 首页 > article >正文

el-select multiple表单校验问题

el-select multiple表单校验问题

<el-form ref='form' :model='form'>
	<el-form-item prop='vulTypes' label='漏洞类型'>
        <el-select v-model='form.vulTypes' @change='vulTypeChange'>
            <el-option v-for='item in vulList' :key='item' :label='item' :value='item'>
            </el-option>
        </el-select>
    </el-form-item>
</el-form>

1、触发校验后, 一打开页面就会触发表单校验

在这里插入图片描述

解决方案:设置初始值为空数组

form: {
    vulType: []
}

在这里插入图片描述

2、选中下拉数据,不会再次触发校验,导致提示文字一直存在
在这里插入图片描述

解决这个问题,首先先看看v-model 、prop属性、rules校验是否正确,这里注意el-select的rules校验的trigger应该是change。

如果以上都没问题,那么还有一个原因就是:嵌套太深,导致form检测不到ruleForm的变化

解决方案:

// 我这里用的是
vulTypeChange() {
    this.form = { ...this.form }
}

在这里插入图片描述


http://www.kler.cn/a/105766.html

相关文章:

  • 10.3 LangChain实战指南:解锁大模型应用的10大核心场景与架构设计
  • LINUX部署微服务项目步骤
  • Mac Electron 应用签名(signature)和公证(notarization)
  • Linux 进程概念
  • 安卓(android)读取手机通讯录【Android移动开发基础案例教程(第2版)黑马程序员】
  • VPR概述、资源
  • 「译文」深入了解Kubernetes和Nomad
  • 【嵌入式】HC32F07X ADC采样及软件滤波
  • Uniapp中嵌入H5( uniapp开发的H5),并且在H5中跳转到APP的指定页面
  • 【Docker】Docker的应用包含Sandbox、PaaS、Open Solution以及IT运维概念的详细讲解
  • 外网访问|SD-WAN跨境网络专线助力企业摆脱网络困境
  • UnrealSynth - 基于虚幻引擎的YOLO合成数据生成器
  • Redis快速上手篇五(持久化)
  • GZ035 5G组网与运维赛题第1套
  • SpringMvc接收参数
  • 31 select max/min/avg/sum/count/group_concat 的实现
  • Response Header中不暴露Server(IIS)版本、ASP.NET及相关版本等信息
  • 第六章(5):Python中的嵌套函数
  • 目标检测的方法
  • 基于Laravel封装一个强大的请求响应日志记录中间件
  • Ubuntu 20.04 上安装和使用 Docker
  • STM32 PWM配置及呼吸灯
  • 【html】图片多矩形框裁剪
  • EasyPoi
  • Istio 自动注入 sidecar 失败导致无法访问webhook服务
  • DevOps持续集成-Jenkins(3)