element-ui中rules使用正则验证、表单验证
<template>
<el-form :model="DataForm" label-position="top" :rules="dialogRules">
<el-form-item label="年龄" prop="loseEfficacyReason">
<el-input type="textarea" v-model="unuseForm.loseEfficacyReason" auto-complete="off"></el-input>
</el-form-item>
</el-form>
</template>
<script>
export default{
data(){
return {
dialogRules: {
loseEfficacyReason: [
{ required: true, message: '请输入原因', trigger: 'blur' },
{ type: 'number',min: 2, message: '请输入不少于2个字符', trigger: 'blur' },
{ pattern: /^[A-Za-z0-9\u4e00-\u9fa5]+$/, message: '不允许输入空格等特殊符号' },
{validator:验证方法,trigger:验证触发}
//参数解释:
//required是不是必填项
//message提示信息文字
//min:2最少不能低于2 max:6最多不能高于6
//pattern这是正则验证规则
//trigger方式,trigger: 'blur' 在失去焦点的时候验证
//type数据类型,input框输入的都是字符串类型,可以在v-model上加一个。namber修饰符
]
}
}
}
}
</script>
element-ui中rules使用正则验证、表单验证的更多相关文章
- javascript基础7(正则及表单验证)
1.正则的概念 JS诞生的目的是什么? 就是为了做表单验证. 在JS未出现以前,表单的信息验证需要传输给后台,让后台做数据验证处理之后,再返回给前端页面处理的结果.在带宽有 ...
- iview中Modal弹窗做form表单验证相关问题
在modal中初始化状态,点击确定弹窗消失. 有的时候表单验证就不希望立刻消失 在iview官网中有自定义页头页脚 可以直接自定义使用 另一种验证写法 serform: { ctCatelogue: ...
- element的日期选择使用value-format之后表单验证报错
在表单验证的时候报错 添加一个日期控件,但是发现在表单验证中遇到了冲突如下: Error in event handler for "el.form.change": " ...
- django中只使用ModleForm的表单验证,而不使用ModleForm来渲染
主题 众所周知,django.forms极其强大,不少的框架也借鉴了这个模式,如Scrapy.在表单验证时,django.forms是一绝,也是面向对象的经典表现.但要用它来渲染表单那就不好玩了,除非 ...
- vue+element ui 关闭弹窗前清空form表单的值
this.$refs['disposeConfigsform'].resetFields();
- iview表单验证之正则验证、函数验证
iview表单验证之正则 正则验证: 代码: loginRules: { stringLength: [ { required: true, message: '该字段不能为空', trigger: ...
- 由表单验证说起,关于在C#中尝试链式编程的实践
在web开发中必不可少的会遇到表单验证的问题,为避免数据在写入到数据库时出现异常,一般比较安全的做法是前端会先做一次验证,通过后把数据提交到后端再验证一次,因为仅仅靠前端验证是不安全的,有太多的htt ...
- nice-validator表单验证插件的简单使用
前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端进行),但设置前端表单校验也是至关重要的,自己写逻辑 ...
- nice-validator表单验证插件
nice-validator表单验证插件的简单使用 前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端 ...
- validate表单验证插件
1.引入validate.js包 <script src="xx/xx/jquery.validate.min.js"></script> 2.表单验证 / ...
随机推荐
- redis集合 实现 队列
先说一下需求:用队列解决 流量削峰,主要应用场景:商城秒杀功能. 以下是业务流程图可以参考一下: 然后本地实现思路 截图下单页面 每次购买数量会减少1,设置了1000个库存,用户id 是随机生成的. ...
- STM32外部中断(EXTI)控制LED亮灭的代码
led.c #include "led.h" void LED_Config(void) { GPIO_InitTypeDef GPIO_InitStruct; RCC_APB2P ...
- 使用JsonConverter处理上传文件的路径
场景 我们上传一个文件,把文件保存到服务器上,会有一个明确的物理路径,由于需要从前端访问这个文件,还需要web服务器中的一个虚拟路径.这个虚拟路径的存储会有一个问题,我们应该在数据库里存什么?是带域名 ...
- 体验一个前端视图层的mvvm的框架Knockoutjs(双向绑定,模板..)..解放您的双手,不再处理那么多的dom操作..快速实现视图层数据与UI的交互处理
笔者之前对于类似前端展示的,可能都是自己开发js对象,集合外加dom事件进行处理.. 近期看到相关资料,了解了Knockoutjs这个框架,下面来段代码: <script type=" ...
- MongoDB从入门到实战之MongoDB工作常用操作命令
前言: 上一章节我们快速的在Docker容器中安装了MongoDB,并且通过Navicat MongoDB可视化管理工具快速的连接.创建数据库.集合以及添加了文档数据源.这一章节我们主要是了解一下在日 ...
- P8340 [AHOI2022] 山河重整
\(20pts\) 给 \(O(2^n)\) 枚举,\(60pts\) 是 \(O(n^2)\),先看看怎么做.计数题无非容斥和 \(dp\),不妨从 \(dp\) 入手.多项式复杂度的做法意味着无法 ...
- ArcObjects SDK开发 一些可直接调用的对话框
在ArcMap中,一些对话框是很复杂的,例如设置点线面样式的对话框,选择空间参考的对话框等,但这些对话框有些在ArcObjects SDK中是可以直接调用的. 1.空间参考选择设置对话框 弹出空间参考 ...
- 干货满满的 Zookeeper 学习笔记
读完< ZooKeeper : Wait-free coordination for Internet-scale systems > 论文的一些笔记,记录下来,方便以后查看 在读论文的时 ...
- Nginx实现跨域
server { listen 80; server_name localhost 127.0.0.1; location / { # 允许跨域请求的"域" add_header ...
- ChatGpt国内教程
近ChatGPT大火呀,小伙伴们是不是在网上看到各种和ChatGPT有趣聊天的截图,比如翻译代码.编写代码,奈何自己实力不够,被网络拒之门外,只能眼馋别人的东西.看别人玩,肯定不如自己玩一把舒服的啊. ...