el-input无法输入的问题和表单验证失败问题解决
作者:CODE-YL 发布时间:2024-04-09 10:48:37
1.el-input无法输入的问题
原因1、el-input组件没有绑定双向响应式数据(v-model)
解决方案:在data中定义一个变量,然后在el-input组件中使用v-model进行双向数据绑定,这样子就会解决el-input组件无法输入的问题了。
原因2、组件嵌套太深还是该组件是一个坑(具体原因不清楚,只知道解决方法)
这时,你会发现我们进行了双向数据绑定了,但是el-input还是无法输入,我们就要使用绑定input事件,然后使用$forceUpdate方法强制刷新,这样子会解决我们el-input无法输入问题,但是这会带出一个新的问题,那就是表单无法进行验证等一些问题。
解决方法的步骤
1.使用input事件,监听用户输入,如果监听输入没有问题,那与html编写无关。2.监听输入没有问题,接下来我们就使用$forceUpdate方法强制刷新,至于表单验证的问题,我们可以使用自定义表单验证来解决因为使用$forceUpdate方法而导致的表单验证失败的问题。
2.表单验证失败的问题
表单验证规则
表单验证规则(如图中的this.rules)是一个对象,你要校验的某一个变量,对应的是一个数组,数组中的trigger:"blur"是当用户失去焦点时触发,required:true,表示该参数时必选的,写入该属性后,校验的那个变量的表单项前会出现小红星,不填则不会出现。
1.1.填写required:true
1.2.不填required:true
例如:我要校验的属性是name时,在data中定义的校验规则为rules:{name:[{validator:validateForm},trigger:"blur",required:true]},其中validateForm是自定义校验函数。
自定义校验函数
表单验证规则失败后,value的值不能用来作为我们的判断依据了,因为该值不会变化,我们应该使用model绑定的表单中的值,利用该值我们就可以自定义表单校验了。
来源:https://blog.csdn.net/weixin_53716093/article/details/128742094


猜你喜欢
- 信息交换用汉字编码字符集-基本集 汉字标准交换码共分两级。第一级为常用字,有3755字,按汉语拼音字母顺序排列,第二级为次常用字,有3008
- 题目:输入字符串将大写转换成小写,小写转换成大写?<strong>js字母大小写转换方法:1、转换成大写:toUpperCase
- 在前面的DRF系列教程中,我们以博客为例介绍了序列化器, 使用基于类的视图APIView和ModelViewSet开发了针对文章资源进行增删
- 根据一个爬取豆瓣电影排名的小应用,来简单使用etree和request库。etree使用xpath语法。import requestsimp
- 发一个数字拼图游戏,有点小疑问前几天写得,其中一段代码还要感谢“簡簡單單愛妳”的提示,不过我还是不太明白, ,有点笨。 $(&qu
- 去除HTML代码中所有标签<% '****************************** '函数:RemoveH
- 目前,Python 科学栈中的所有主要项目都同时支持 Python 3.x 和 Python 2.7,不过,这种情况很快即将结束。去年 11
- transforms按住Ctrl查看transforms的源码可以知道,transforms就是一个python文件,里面定义了很多类,每一
- with 用法理解Overviewwith 与with之后的object一起,起到了抛出异常和单独生成一个空间让代码在空间里运行的效果。实验
- 由于个人能力有限,文章中难免会出现错误或遗漏的地方,敬请谅解!同时欢迎你指出,以便我能及时修改,以免误导下一个看官。最后希望本文能给你带来一
- 分布式编程的难点在于:1.服务器之间的通信,主节点如何了解从节点的执行进度,并在从节点之间进行负载均衡和任务调度;2.如何让多个服务器上的进
- Pandas处理CSV文件,分为以下几步:读取Pandas文件统计列值出现的次数筛选特定列值遍历数据行绘制直方图(柱状图)读取Pandas文
- 本文实例讲述了Python实现批量将word转html并将html内容发布至网站的方法。分享给大家供大家参考。具体实现方法如下:#codin
- 创建随机数 ①自JavaScript产生后,好多浏览器中都有内置的随机数发生方法。例如: var number = Math.random(
- 今天有碰到这种情况,数据库中有张表没办法通过migration来更改, migrate时报 django.db.utils.Operatio
- 本文实例讲述了python中sleep函数用法。分享给大家供大家参考。具体如下:Python中的sleep用来暂停线程执行,单位为秒#---
- 何为共线性:共线性问题指的是输入的自变量之间存在较高的线性相关度。共线性问题会导致回归模型的稳定性和准确性大大降低,另外,过多无关的维度计算
- 本文实例讲述了Python常见数据类型转换操作。分享给大家供大家参考,具体如下:类型转换主要针对几种存储工具:list、tuple、dict
- 功能描述抽奖系统包含如下特点:1、可给不同抽奖者设置不同的权重2、先从价值高的奖品开始抽3、已经中奖的人,不再参与后续的抽奖代码第一个数字表
- 深入解析Linux下MySQL数据库的备份与还原 1. 备份 [root@localhost ~]# cd /var/lib/mysql (