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函数式组件用好, 提高性能, 从而实现业务需求也成为了一种能力的体现......咳咳咳, 进入正题: 现实场景需求 我想实现这一个需求, 父 ...
随机推荐
- iOS应用程序开发——解决iOS7之前版本与之后版本下app启动图片跳动问题
之前开发的app都是针对iOS6(兼容iOS5),所以在开发之初也出现了启动图片向下跳动的现象,通过网上的解决方法,代码中做了处理(“-20”): _imageView.frame = CGRectM ...
- 《内蒙古自治区第十二届大学生程序设计竞赛试题_G: 最大收益》
问题 G: 最大收益 内存限制:128 MB时间限制:1 S标准输入输出 题目类型:传统评测方式:文本比较上传者:外部导入 提交:87通过:23 返回比赛提交提交记录 题目描述 Elly的叔叔经营一家 ...
- SpringMVC学习笔记七:SpringMVC的数据验证
SpringMVC支持JSR(Java Specification Requests, Java规范提案)303-Bean Validation数据验证规范,该规范的实现者很多,其中较常用的是 Hib ...
- unicode编码与解码
unicode编码与解码,代码如下 package com.fenqiguanjia.api.services; /** * Created by daixianjun on 2017/9/3. */ ...
- 吴裕雄--python学习笔记:sqlite3 模块
1 sqlite3.connect(database [,timeout ,other optional arguments]) 该 API 打开一个到 SQLite 数据库文件 database 的 ...
- 在MVC模式下通过Jqgrid表格操作MongoDB数据
看到下图,是通过Jqgrid实现表格数据的基本增删查改的操作.表格数据增删改是一般企业应用系统开发的常见功能,不过不同的是这个表格数据来源是非关系型的数据库MongoDB.nosql虽然概念新颖,但是 ...
- js对象或数组深复制
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Windows 下 LaTeX 手动安装宏包(package)以及生成帮助文档的整套流程
本文简单介绍如何手动安装一个 LaTeX 宏包. 一般来说,下载的 TeX 发行版已经自带了很多宏包,可以满足绝大部分需求,但是偶尔我 们也可能碰到需要使用的宏包碰巧没有安装的情况,这时我们就需要自己 ...
- 用Python搭建简单的HTTP服务 · Zhangxu's Blog
分享一个快速用Python搭建简单的HTTP服务的方法. 平时我们可能有需要,传输某个文件到手机,或者工作中某台服务器的电脑. 假如这个手机是个测试手机/服务器,并没有微信QQ之类的软件,而且你也不想 ...
- Hi3518_SDK
第一章 Hi3518_SDK_Vx.x.x.x版本升级操作说明 如果您是首次安装本SDK,请直接参看第2章. 第二章 首次安装SDK 1.Hi3518 SDK包位置 在"Hi3518_V10 ...