el-select multiple表单校验问题

news2025/1/12 23:10:52

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.coloradmin.cn/o/1127820.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

智能井盖传感器特点是什么?

在城市基础设施建设过程中&#xff0c;无论是国际大都市还是小县城&#xff0c;井盖所导致的问题会严重影响着城市地下生命线。井盖如若出现移动翻转等现象&#xff0c;是市民生命安全的潜在隐患&#xff0c;也有可能会影响下水道&#xff0c;供水管道等正常运行。所以传统井盖…

HashMap 源码解析

目录 一. 前言 二. 哈希表 三. 源码解析 3.1. 数据结构 3.2. 类结构 3.3. 字段属性 3.4. 构造方法 3.5. 确定哈希桶数组索引位置 3.6. 添加元素 3.7. 扩容机制 3.8. 删除元素 3.9. 查找元素 一. 前言 HashMap基于哈希表的Map接口实现&#xff0c;是以key-value存储…

JavaScript 函数 eval() , json字符串转换

eval() eval() 函数计算 JavaScript 字符串&#xff0c;并把它作为脚本代码来执行。 如果参数是一个表达式&#xff0c;eval() 函数将执行表达式。如果参数是Javascript语句&#xff0c;eval()将执行 Javascript 语句 console.log(eval(2 2)); // Expected output: 4console…

基于SSM的论文投稿系统

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;Vue 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#xff1a;是 目录…

PMP考试时间是什么时候?

PMP官方公布&#xff0c;一般来说&#xff0c;一年有4次&#xff0c;分别在3月、6月、9月和12月。具体日期或者时间变动看官方通知。 pmp干货&#xff1a;点击免费刷题&#xff0c;PMP第七版&#xff0c;预测敏捷资料免费分享&#xff01; 来说一下考试的相关情况 1、考试题型…

【EI会议征稿】第十届机电一体化与工业信息学国际学术研讨会(ISMII 2024)

第十届机电一体化与工业信息学国际学术研讨会&#xff08;ISMII 2024&#xff09; 2024 10th International Symposium on Mechatronics and Industrial Informatics 随着往年九届的成功举办&#xff0c;2024年第十届机电一体化与工业信息学国际学术研讨会&#xff08;ISMII…

docker安装mqtt服务器, 并测试连接

docker run -d --name emqx -p 1883:1883 -p 8083:8083 -p 8084:8084 -p 8883:8883 -p 18083:18083 emqx/emqx:5.3.0 使用mqttx进行测试: 参考: 下载 EMQX

自定义命名不同类型文件,隐藏编号轻松整理,一键操作高效便捷!

你是否曾经因为文件名混乱而烦恼&#xff0c;或者因为编号重复而感到困扰&#xff1f;让我们一起解决这个问题&#xff0c;推荐一款强大的文件改名工具&#xff0c;帮助你个性化文件改名&#xff0c;自定义命名不同类型文件&#xff0c;隐藏编号轻松整理&#xff01; 首先我们…

软件测试进阶篇----Python

Python python语言的学习技巧&#xff1a;多写多敲 要求能够掌握基础知识&#xff0c;能够使用python实现自动化脚本的开发即可&#xff01;&#xff01;&#xff01; 一、python语言的特点 python是一种胶水语言&#xff1a;python需求和其他的行业结合在一起才能发挥更大…

Go语言Goroutine

在本教程中&#xff0c;我们将讨论如何使用 Goroutines 在 Go 中实现并发。 什么是 Goroutine&#xff1f; Goroutine 是与其他函数或方法同时运行的函数或方法。Goroutines 可以被认为是轻量级线程。与线程相比&#xff0c;创建 Goroutine 的成本很小。因此&#xff0c;Go 应…

AI基础软件:如何自主构建大+小模型?

导读&#xff1a;AI 基础软件作为大型 AI 模型的底座&#xff0c;承载着顶层大模型的建设&#xff0c;也是大模型应用落地的关键。为了更好地支持大模型的训练和演进&#xff0c;设计与开发基础软件便显得尤为重要。本文分享了九章云极DataCanvas如何自主构建大 小模型的经验与…

1024程序员节:理解编码背后的艺术

1024的含义 "1024"在中国互联网文化中有两个主要的含义&#xff1a; 1024是2的10次方&#xff0c;这在计算机科学中是一个重要的数字&#xff0c;因为计算机的基础是二进制。因此&#xff0c;程序员们常常把1024作为一个特殊的日子来庆祝&#xff0c;也就是10月24日…

如何把项目上传到Gitee(详细教程)

找到项目根目录右键打开Git Bash Here 输入命令&#xff1a;git init 回车 输入命令&#xff1a;git status 输入命令&#xff1a;git add . 输入命令&#xff1a;git status git commit -m 项目描述 在Gitee官网注册好账号后&#xff0c;git 新建项目 填写补充git项目信息及…

SAP采购发票差异处理

&#xff08;一&#xff09; 税金差异 一般情况下&#xff0c;供应商的开票金额与我们的入库金额一致&#xff0c;不过有时也会出现不一致的情况&#xff0c;如通过金税系统开票出现尾差&#xff0c;或是开票价格大于订单价格。本文介绍如何处理采购发票中的税金差异。 采购订…

【单调栈】84. 柱状图中最大的矩形、60天刷题总结

提示&#xff1a;努力生活&#xff0c;开心、快乐的一天 文章目录 84. 柱状图中最大的矩形&#x1f4a1;解题思路&#x1f914;遇到的问题&#x1f4bb;代码实现&#x1f3af;题目总结 总结数组链表哈希表数组作为哈希表set作为哈希表map作为哈希表 字符串要不要使用库函数双指…

Jmeter接口测试(十一):BeanShell脚本详解

BeanShell简介 BeanShell是一种完全符合Java语法规范的脚本语言,并且又拥有自己的一些 语法和方法&#xff1b; BeanShell是一种松散类型的脚本语言&#xff1b; BeanShell是用Java写成的&#xff0c;一个小型的、免费的、可以下载、嵌入式的 Java源代码解释器&#xff0c;具…

Vue脚手架的安装和分析

一、Vue脚手架的安装步骤 &#xff08;一&#xff09;全局安装Vue脚手架 Window R&#xff0c;输入cmd进入电脑终端。 在终端中输入如下命令全局安装Vue脚手架&#xff1a; npm install -g vue/cli 下载过程中会警告&#xff0c;但不用关心这个。 &#xff08;二&#xff…

经管博士科研基础【26】海塞矩阵

1. 海塞矩阵 海塞矩阵是一个由多变量实值函数的所有二阶偏导数组成的方块矩阵。 一元函数就是二阶导,多元函数就是二阶偏导组成的矩阵。求向量函数最小值时可以使用,矩阵正定是最小值存在的充分条件。经济学中常常遇到求最优的问题,目标函数是多元非线性函数的极值问题,尚…

许战海方法论日文版正式发布,多家日媒转发

10月18日&#xff0c;日本财经媒体掀起了一场轻微的风潮&#xff0c;近40家权威媒体纷纷转发了一条引人注目的新闻:帆をあげて、海へ」、許戦海方法論の日本語版が正式に発表(扬帆起航&#xff1a;许战海方法论日文版正式发布)。 日本焦点新闻、阿波罗新闻、乐天新闻等权威媒体…

vue3 源码解析(1)— reactive 响应式实现

前言 本文是 vue3 源码解析系列的第一篇文章&#xff0c;项目代码的整体实现是参考了 v3.2.10 版本&#xff0c;项目整体架构可以参考之前我写过的文章 rollup 实现多模块打包。话不多说&#xff0c;让我们通过一个简单例子开始这个系列的文章。 举个例子 <!DOCTYPE html…