iview的input框校验添加v-modal.number会影响校验,还是依照API使用number来转换number类型
公司项目使用了iview2.0版本的,有一个需求是需要把里面的值换成number类型并且校验,代码大致如下,使用了v-modal.number来实现转换,
<FormItem label="学号" prop="name">
<Input v-model.number=" Student.Sno" placeholder="Enter name"></Input>
</FormItem>
校验的代码如下是,其中Regular.rule是校验的正则,
Sno:[ { type:'number', trigger: 'blur', message:'公估费(含税)必填'}, {required: true, pattern: Regular.rule, trigger: 'blur', message:'公估费(含税)必填'}, ]
后来发现校验并不完全符合理想,之火查API看到Input组件有一个属性number可以转换,依照改成下面这样子就可以了
<FormItem label="学号" prop="name">
<Input v-model=" Student.Sno" placeholder="Enter name" number></Input>
</FormItem>
iview的input框校验添加v-modal.number会影响校验,还是依照API使用number来转换number类型的更多相关文章
- el-mement表单校验-校验失败时自动聚焦到失败的input框
思路:调用input的focus()事件,聚焦到失败的input框上, 问题:如何获取失败的input框,结合element的校验方法,查看可以提供入口的地方 调用this.$refs[formNam ...
- element 表单校验失败自动聚焦到失败的input框
1.在对应的input框上添加ref属性,直接根据ref就可精确地获取到元素 <el-form-item label="课程名称" :label-width="fo ...
- 关于键盘事件-查询:有多个input框,任意一个支持enter键查询
应用场景:同一个界面有多个input框支持任意一个Enter查询. 实现:在input框中添加onkeypress="函数名()". 函数里面编写对应键盘code值,在里面直接调用 ...
- 给“file”类型的input框赋值的问题
开发"新闻编辑"功能时,会遇到给"file"类型的input框赋值的问题,用来展示之前上传的文件,但由于file类型的input框受到安全限制,所以不能被赋值, ...
- element ui input框不能输入的问题(实时学习)
解决: 在input的上面添加数据v-model 既可以 1.菜单中api (2018年8月14号) :default-active 默认根据当前路由选中菜单,值需要和 el-submenu 的属 ...
- h5 页面点击添加添加input框
h5 页面点击添加添加input框 前段时间有个需求,页面要能点击添加按钮控制input框的个数,当时感觉有点难,就没做,这两个又遇到了,没办法写了个简单的 效果图,加号增加,减号减少 直接上代码, ...
- 使用iview如何使左上的添加按钮和右上的搜索框和边框对齐
使用iview如何使左上的添加按钮和右上的搜索框和边框对齐呢? 效果如下: 使用iview自带的Grid 栅格进行布局,但是由于按钮和搜索框的大小不正好是一个栅格的宽度,所以不是很好跳转,且栅格也不支 ...
- 让单选input框,不在被选中,添加disabled即可。输入框input的一些技巧
1.让单选input框,不在被选中,添加disabled即可 2.input的file文件对象的清空,只需要input.val("");就可以了.
- 函数式组件中实现Antd打开Modal后其Input框自动聚焦(focus)到文字的最后
目前React使用函数式组件已经成为趋势, 如何把React函数式组件用好, 提高性能, 从而实现业务需求也成为了一种能力的体现......咳咳咳, 进入正题: 现实场景需求 我想实现这一个需求, 父 ...
随机推荐
- mongodb use where and custom function to query mongodb存储过程
function name regexObjSubObjKey function code function(proto,value) { var match=false; var reg = new ...
- 搭建harbor企业级私有registry
主机环境要求 硬件Hardware Resource Capacity Description CPU minimal 2 CPU 4 CPU is prefered Mem minimal 4GB ...
- <JZOJ1286>太空电梯
一道简单可爱的dp #include<cstdio> #include<iostream> #include<cstring> #include<algori ...
- 自研测试框架ktest介绍(适用于UI和API)
iTesting,爱测试,爱分享 在自动化测试的过程中,测试框架是我们绕不过去的一个工具,无论你是不需要写代码直接改动数据生成脚本,还是你需要检查测试结果甚至持续集成,测试框架都在发挥它的作用. 不同 ...
- 查漏补缺:Vector中去重
对于STL去重,可以使用<algorithm>中提供的unique()函数. unique()函数用于去除相邻元素中的重复元素(所以去重前需要对vector进行排序),只留下一个.返回去重 ...
- python xlwings Excel 内容截图
import xlwings as xw from PIL import ImageGrab def excel_save_img(path, sheet=0, img_name="1&qu ...
- 利用动态资源分配优化Spark应用资源利用率
背景 在某地市开展项目的时候,发现数据采集,数据探索,预处理,数据统计,训练预测都需要很多资源,现场资源不够用. 目前该项目的资源3台旧的服务器,每台的资源 内存为128G,cores 为24 (co ...
- Kali虚拟机的扩容经历
Kali虚拟机的扩容经历 0x01 起因 更新了一下软件包,竟然提示我空间不足. 升级了 687 个软件包,新安装了 82 个软件包,要卸载 0 个软件包,有 8 个软件包未被升级. 需要下载 1,5 ...
- 使用QT绘制一个多边形
目录 1. 概述 2. 实现 2.1. 代码 2.2. 解析 3. 结果 1. 概述 可以通过QT的重绘事件和鼠标事件来绘制多边形,最简单的办法就是在继承QWidget的窗体中重写paintEvent ...
- 从web现状谈及前端性能优化
从web现状谈及性能优化 原文出处:<Karolina Szczur: The State of the Web> 性能优化指南The Internet is growing expone ...