【vue】rules校验规则简单描述

embedded/2025/1/18 14:59:43/

以ant举个例子

<a-form-model :model="form"  layout="inline"  :rules="rules"ref="portRuleForm">
</a-form-model>

这里面重要的字段有几个rules model ref
现在有个时间框要校验,先写好代码

<a-form-model-item label="基准日期" prop="baseDate"><a-date-picker class="jy-wfull" v-model="form.baseDate" /></a-form-model-item>

这里的modelform.baseDate 对应上面的model="form",所以我们的propbaseDate,注意要校验那个字段,就去写哪个model名字在prop
下面描述下规则,这个要写data里面

rules: {baseDate: [{ required: true, message: '请选择时间', trigger: 'change' },]}

这个是简单点的,如果自定义规则

baseDate: [{ required: true, message: '请选择时间'},{ validator: this.validateBaseDate, trigger: 'change' }],

然后我们在methods里写入方法

validateBaseDate(rule, value, callback) {if(!this.form.XXXX){callback(new Error('请选择时间'));}else{callback();}},

最后是提交的时候加入判断

savePortRule() {this.$refs.portRuleForm.validate((valid) => {if (valid) {XXXX提交到后端}})},

这里的portRuleForm是最上面a-form-model里的ref的值


http://www.ppmy.cn/embedded/154970.html

相关文章

如何在一个查询中使用多个DbContext?

一、前言 在软件开发的广袤领域中&#xff0c;数据来源的多样性与复杂性与日俱增。如今&#xff0c;我们常常面临着这样的挑战&#xff1a;如何在同一查询中巧妙地运用两个或多个 DbContext。 想象一下&#xff0c;在一个大型企业级应用里&#xff0c;订单数据存于数据库 A&a…

【Linux】10.Linux基础开发工具使用(3)

文章目录 使用 git 命令行&#xff08;初级&#xff09;Ubuntu安装 git注册gitee用户并创建gitee仓库Ubuntu下使用git 使用 git 命令行&#xff08;初级&#xff09; Ubuntu安装 git 首先更新软件源&#xff1a; sudo apt update然后再次尝试安装 git&#xff1a; sudo apt…

Android SystemUI——StatusBar视图创建(六)

上一篇文章我们介绍了 StatusBar 的构建过程,在 makeStatusBarView() 中获得 FragmentHostManager,用来管理 StatusBar 的窗口。 一、状态栏视图 在得到 FragmentHostManager 实例对象之后,还会继续调用 addTagListener() 方法设置监听对象,然后获取 FragmentManager 并开…

55.【5】BUUCTF WEB NCTF2019 sqli

进入靶场 输入admin 123 过滤的这么严格&#xff1f;&#xff1f;&#xff1f; 过滤很严格&#xff0c;此时要么爆破&#xff0c;要么扫描 直接扫描&#xff0c;得到robots.txt 访问后又得到hint.txt 继续访问 图片内容如下 $black_list "/limit|by|substr|mid|,|admi…

每日进步一点点(网安)

1.BUU CODE REVIEW 1 先看源代码 <?phphighlight_file(__FILE__);class BUU {public $correct "";public $input "";public function __destruct() {try {$this->correct base64_encode(uniqid());if($this->correct $this->input) {ec…

NLP DAY2: 文本数据处理(一部分)

事情无论巨细&#xff0c;往往存在一个准备阶段。比如做饭炒菜&#xff0c;需要择菜、洗菜、切菜、热锅等准备工作&#xff1b;出远门需要整理好身份证、手机、钱包等随身物品。类似地&#xff0c;在处理文本的任务中&#xff0c;也存在预处理这么一个重要阶段&#xff0c;包括…

【数据分析与可视化】Python绘制数据地图-GeoPandas地图可视化

本文主要介绍GeoPandas结合matplotlib实现地图的基础可视化。GeoPandas是一个Python开源项目&#xff0c;旨在提供丰富而简单的地理空间数据处理接口。GeoPandas扩展了Pandas的数据类型&#xff0c;并使用matplotlib进行绘图。GeoPandas官方仓库地址为&#xff1a;GeoPandas。G…

【深度学习】Windows系统Anaconda + CUDA + cuDNN + Pytorch环境配置

在做深度学习内容之前&#xff0c;为GPU配置anaconda CUDA cuDNN pytorch环境&#xff0c;在网络上参考了很多帖子&#xff0c;但pytorch的安装部分都有些问题或者比较复杂繁琐&#xff0c;这里总结了相对简单快速的配置方式 文章目录 AnacondaCUDAcuDNNpytorchtorchtorchau…