代码编织梦想

可以使用正则表达式对输入框进行验证,确保输入的日期格式正确且不包含0开头的月和日。下面是一个示例的正则表达式:

new RegExp("^(\\d\\d\\d\\d)(?:\\.(\\d\\d)(?:\\.(\\d\\d))?)?$").test(dateString)

这个正则表达式可以匹配以下格式的日期:

  • "YYYY": 如: 1998
  • "YYYY.MM": 如: 1998.01 或者 1998.12
  • "YYYY.MM.DD": 如: 1998.01.01 或者 1998.12.13
  • "YYYY": 检查字符串是否以 4 个数字开头,不是 0 开头。
  • ".": 检查字符串是否以 "." 结尾。
  • ".": 检查字符串是否以 "." 结尾。

在 element-ui 中,你可以使用 el-formel-input 和 el-form-item 等组件来实现输入框的验证。在 el-form-item 中设置 prop 属性为 'birthday',然后使用 rules 属性来指定验证规则,如下所示:

<el-form ref="form" :model="form" :rules="rules">
<el-form-item label="生日" prop="birthday">
<el-input v-model="form.birthday"></el-input>
</el-form-item>
</el-form>
data() {
return {
form: {
birthday: ''
},
rules: {
birthday: [
{ required: true, message: '请选择生日', trigger: 'blur' },
{ type: 'regExp', regex: /^(\d\d\d\d)(?:\.(\d\d)(?:\.(\d\d))?)?$/, message: '请按照 YYYY 或 YYYY.MM 或 YYYY.MM.DD 的格式输入' }
]
}
}
}

其中 required: true 表示必填项,"message" 属性定义了验证失败时的错误提示信息,"trigger" 属性定义了何时触发验证。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/m0_68231587/article/details/131022599

element-ui中的input失焦验证_水蜜桃那么甜的博客-爱代码爱编程

一般情况下,input失焦验证只需要一句话就行 name: [{ required: true, message: "请输入真实姓名", trigger: "blur" }]  这是验证失焦时如果没有输入东西,那么下面就会出现一句 ‘请输入真实姓名’, 但是现在后台有一个需求,就是如果在失焦的情况下,如果输入的用户名与之前有重复,那么下面就会出现一句

vue element-ui实现input输入框金额数字添加千分位【转载】-爱代码爱编程

在util.js中定义方法 包含金额添加过滤千分位,验证金额格式等 1、在util.js中定义方法 const MoneyTest = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/; // 金额添加千分位 const comdify = function (n) { if(!n) return n; let

element-ui表单输入框开启记忆功能-爱代码爱编程

<el-form ref="form" :model="formData" label-width="120px"> <el-form-item prop="item1" label="示例1:" :required="true" error="请输入值" > <!-- name 要和 el-f

element输入框中显示单位_Vue.js element-ui实现input输入框金额数字添加千分位-爱代码爱编程

Vue.js element-ui实现input输入框金额数字添加千分位 发布于 2020-2-21| 复制链接 摘记: 在util.js中定义方法包含金额添加过滤千分位,验证金额格式等 ```javascript const MoneyTest = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/; // 金额添加千

element-ui实现input输入框金额数字添加千分位组件-爱代码爱编程

创建一个amountFormat.js const MoneyTest = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/; // 金额添加千分位 const comdify = function (n) { if(!n) return n; let str = n.split('.'); let re

使用element-ui写获取验证码输入框-爱代码爱编程

点击发送验证码按钮,校验手机号 <el-form-item prop="phone"> <el-input v-model="forgetPForm.phone" placeholder="请输入手机号" >&

在vue中element-ui对表单字段进行验证(rules)-爱代码爱编程

1. 写在 data 中验证 表单内容 <!-- 表单 --> <el-form ref="rulesForm" :rules="formRules" :model="rulesForm" label-width="200px"> <el-form-item label="用户名称:" prop="userName

vue 获取url地址的参数-爱代码爱编程

  url是一个 URL地址,我们在使用 vue的时候,经常需要获取 url的参数,获取方法有很多种,这里我只介绍一种获取 url参数的方法,那就是使用 Requests. urlset. newContext ()方法。 这个方法就是调用 requests. urlset. newContext ()方法来获取 url的参数。在这个方法中,我们需要

element-爱代码爱编程

element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索,自己经过数次爬坑 之后,总结了几种form表单的验证规则,为了便于阅读,验证规则是拆分的 1. 普通输入验证 <el-form-item l

element-爱代码爱编程

先看效果: 代码实现: HTML <el-form :model="condition" ref="apply_form_list" label-width="120px"> <el-

【q&a】[vue/element-爱代码爱编程

引入:element-ui的表单验证是使用rules来定义规则,其中日期类型的表单输入框如图所示,一般会使用 format 来设置自己需要的日期格式: <el-form-item label="生日" prop="b

vue中组件和插件有什么区别?-爱代码爱编程

Vue中组件和插件有什么区别? 组件是什么 组件就是把图形、非图形的各种逻辑均抽象为一个统一的概念(组件)来实现开发的模式,在Vue中每一个.vue文件都可以视为一个组件 组件的优势 降低整个系统的耦合度,在保持接口

vue-爱代码爱编程

效果图  kindeditor 引入     一、去官网下载 kindeditor 包  官方链接            二、在vue里的static文件夹下 创建一个 文件夹名字叫 kindeditor, 把下载好的文件放在这里  三、在 公共组件 components 下 创建kindeditor.vue 文件 <

vue基础入门(下)_vux.:nv b& b bin-爱代码爱编程

<script src="https://unpkg.com/vue@next"></script> nvm安装node.jsnvm文档手册 - nvm是一个nodejs版本管理工具 - nvm中文网 (uihtm.com) mixin混入(局部使用) 定义mixin对象  <script> // mix