element plus自定义组件表单校验

方式一:

import { formContextKey, formItemContextKey } from "element-plus";// 获取 el-form 组件上下文
const formContext = inject(formContextKey, void 0);
// 获取 el-form-item 组件上下文
const formItemContext = inject(formItemContextKey, void 0);formItemContext?.prop && formContext?.validateField([formItemContext.prop as string]);

方式二:

// 子组件核心流程
import { useFormItem } from "element-plus";
const { formItem } = useFormItem();
const emit = defineEmits(["update:value"]);const content = computed({get() {return props.value;},set(v: string) {// 同步父组件值emit("update:value", v);// 触发父组件定义的rulesformItem?.validate?.("blur").catch(err => {console.log(err);});}
});// 父组件 rules
<el-form-item label="回复内容" prop="content" :rules="requiredRules"><!-- 父组件调用 --><tinyMce v-model:value="form.content"></tinyMce>
</el-form-item>const requiredRules = [{ required: true, message: "请填写", trigger: "blur" }];

element ui 自定义组件校验方式,详见以下链接地址
使用element Form 自带校验功能,实现上传控件的校验_element form 校验mixin-CSDN博客​​​​​

ant design vue 1.x 自定义组件校验方式,详见以下链接​​​​​​​ant design vue1.x 自定义校验_1.x ant-design-vue date-range-picker 校验-CSDN博客

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/622396.shtml

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

相关文章

NLP论文阅读记录 - 2021 | WOS 使用深度强化学习及其他技术进行自动文本摘要

文章目录 前言0、论文摘要一、Introduction1.1目标问题1.2相关的尝试1.3本文贡献 二.相关工作2.1. Seq2seq 模型2.2.强化学习和序列生成2.3.自动文本摘要 三.本文方法四 实验效果4.1数据集4.2 对比模型4.3实施细节4.4评估指标4.5 实验结果4.6 细粒度分析 五 总结思考 前言 Auto…

Java:常见算法

认识算法 什么是算法&#xff1f; 解决某个实际问题的过程和方法 学习算法的技巧 先搞清楚算法的流程直接去推敲如何写代码 排序算法 冒泡排序 每次从数组中找出最大值放在数组的后面去。 实现冒泡排序的关键步骤分析 确认总共需要做几轮&#xff1a;数组的长度-1每轮比较…

【java】创建打印数组的方法并调用

java的数组和Python不一样&#xff0c;不能直接用print打印&#xff0c;而如果每次都用循环的方法&#xff0c;比较麻烦&#xff0c;就直接创建一个类&方法&#xff0c;每次用的时候直接调用。 public class list_deal {public static void printArray(int[] arr){for (in…

Python实现对角但非同一性协方差结构回归模型(WLS算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 WLS回归分析是一种常用的回归分析方法&#xff0c;通过对数据进行加权处理&#xff0c;可以更准确地评…

构造函数的初始化列表

一、什么是初始化列表 初始化列表&#xff1a;以一个冒号开始&#xff0c;接着是一个以逗号分隔的数据成员列表&#xff0c;每个"成员变量"后面跟 一个放在括号中的初始值或表达式。 class Date { public:Date(int year, int month, int day): _year(year), _month(m…

VSCode编写 C/C++ 程序

VSCode 全称 Visual Studio Code&#xff0c;是微软出的一款轻量级代码编辑器&#xff0c;免费、开源而且功能强大。它支持几乎所有主流的程序语言的语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、GIT 等特性&#xff0c;支持插件扩展&#xff0c;并…

Day02

今日任务&#xff1a; 977 有序数组的平方209 长度最小的子数组59 螺旋矩阵Ⅱ 977 有序数组的平方 题目链接&#xff1a;https://leetcode.cn/problems/squares-of-a-sorted-array/ 双指针问题&#xff0c;以及数组本身时有序的&#xff1b; 思路&#xff1a; 左、右两个…

SG-8101CGA 系列 (晶体振荡器 可编程 可用 +125°C )

SG-8101CGA是可编程晶体振荡器&#xff0c;具有CMOS输出&#xff0c;适用于汽车&#xff0c;同时&#xff0c;该系列还提供相同的频率和其他参数的轻松编程能力&#xff0c;符合AEC-Q100标准&#xff0c;具有出色的电磁兼容性和稳定性&#xff0c;可以在各种环境下使用。外部尺…

Linux的DHCP工作原理和dns服务器

目录 一、DHCP原理 1.DHCP的好处 2.DHCP的分配方式 3.实验 二、dns服务器 1.什么是dns 2.dns域名解析 3、在内网搭建dns 一、DHCP原理 DCHP工作原理使用C/S架构 &#xff08;1&#xff09;第一步&#xff0c;客户端广播发送一个discover报文寻找DHCP服务器。 &#…

cf919Div2C题题目总结

Problem - C - Codeforces 这道题其实是一道数学题。 先看第一个变量&#xff0c;也就是我们要求的答案k的数量&#xff0c;但看k是很好确定它的限制条件的&#xff0c;要想均匀分成k份&#xff0c;n%k必须为0&#xff0c;有了k&#xff0c;我们再来看m&#xff0c;对于a(1)和…

牛客周赛 Round 28 解题报告 | 珂学家 | 组合数学 + 离散化树状数组

前言 整体评价 还是E稍微有点意思&#xff0c;新周赛好像比预期要简单一些, _. 欢迎关注 珂朵莉 牛客周赛专栏 珂朵莉 牛客小白月赛专栏 A. 小红的新周赛 思路: 模拟 #include <bits/stdc.h>using namespace std;int main() {int res 0;for (int i 0; i < 6; i…

开源的Immich自建一个堪比 iCloud 的私有云相册和备份服务

源码地址 GitHub - immich-app/immich: Self-hosted photo and video backup solution directly from your mobile phone. 1.创建目录 mkdir /data/immich && cd /data/immich 2.下载docker-compose文件和.env文件 wget https://github.com/immich-app/immich/relea…

x86是什么?

x86是一系列CPU架构的统称&#xff0c;这一术语起源于1978年&#xff0c;当时Intel发布了其首款16位微处理器——8086。这款处理器在当时引起了极大的关注&#xff0c;因为它首次引入了许多先进的技术&#xff0c;如寄存器间接寻址和分段内存管理等。随后&#xff0c;Intel又相…

Linux:/proc/kmsg 与 /proc/sys/kernel/printk_xxx

目录 前言一、/proc/kmsg1、简介2、如何修改内核日志缓冲区3、dmesgklogctl 函数&#xff08;来源于 man 手册&#xff09; 4、扩展阅读 二、 /proc/sys/kernel/printk_xxx三、/dev/kmsg 前言 本篇文章将为大家介绍与 Linux 内核日志相关的一些控制文件&#xff0c;共同学习&am…

代码随想录算法训练营第十九天|98.验证二叉搜索树 530.二叉搜索树的最小绝对差.501.二叉搜索树中的众数

98.验证二叉搜索树 public boolean isValidBST(TreeNode root) {return valid(root, Long.MAX_VALUE, Long.MIN_VALUE);}public Boolean valid(TreeNode root, Long maxVal, Long minVal) {if (root null) {return true;}if (root.val < minVal || root.val > maxVal) …

UE5 PCG插件场景静态网格模块化、快速搭建场景

PCG图表可以理解为静态网格体图表&#xff0c;里面可以自定义放不同有静态网格体、可以对密度、大小、面积等等在场景实际应中做相应的调整&#xff0c;可以根据地形高度随机生成静态网络体&#xff0c;可以模化作业。大大降低了场景制的时间成本。PCG插件目前需要UE5.2以上的版…

Multimodal Prototypical Networks for Few-shot Learning

tcGAN is provided with an embedding ϕ T \phi_T ϕT​() of the textual description 辅助信息 作者未提供代码

【ArcGIS Pro微课1000例】0056:度分秒与十进制度互相转换(度分秒→度、度→度分秒)

ArcGIS软件可以很方便的直接实现度分秒转度、度转度分秒(度分秒→度、度→度分秒)。 文章目录 一、转换预览二、工具介绍三、案例解析一、转换预览 借助ArcGIS快速实现度分秒与度及其他格式的坐标转换,例如:度分秒→度、度→度分秒。 1. 度→度分秒 2. 度分秒→度 转换后…

【遇见Transformer】Transformer代码、原理全方位解析,相信我,看这一篇就够了!

目录 前言 预备知识 本章代码环境 关注我&#xff0c;不迷路 &#xff01; Transformer模型的结构​编辑 Transformer模型的基本原理 注意力机制 自注意力机制 两者的区别 多头注意力机制 Transformer模型的训练 Transformer模型的应用 论文地址 前言 预备知识 在…