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
猜你喜欢
- 本文实例讲述了Python企业编码生成系统之系统主要函数设计。分享给大家供大家参考,具体如下:一 主要函数功能描述函数功能mkdir判断保存
- open(filename,mode,buffer) 其中第一个参数是要打开的文件的文件名,必选;第二个是打开方式,可选;第三个为缓冲区,可
- Math.min()和Math.max()用法相似。两个方法用来获取给定的一组数值中的最大值或最小值,但是却不接受数组作为参数。当然可以写个
- 一个else语句可以使用if语句结合起来。如果在if语句中的条件表达式解析为0或false值,那么else语句包含代码执行。el
- 写完“无序列表”和“有序列表”之后已经有人和我说这两篇看得没什么意思。这两篇文章如果只以单向读取的形式阅读那么的确是没什么意思,但是这两篇重
- 一、数字类型所谓的“数字类”,就是指 DECIMAL 和 NUMERIC,它们是同一种类型。它严格的
- 印刷和网络是不一样的。传统的布局排版并不适于网络,因为传统的印刷布局,几乎只想要什么样的平面效果都能很好的达到,但在网络上设计就很困难,尽管
- 简述1.pythonpython作为一门解释型脚本语言,它有三种发布方式:文件 : 源码文件,运行需要使用者安装Python环境并且安装依赖
- 写出来的效果图就是这样了:下面就更新一下全部的代码吧还是老样子先定义import pygame,sysimport ra
- 本文实例为大家分享了python实现人脸签到系统的具体代码,供大家参考,具体内容如下简易版人脸签到/签退系统管理员可进行录入人脸操作,以及导
- 获得当前机器的名字:def hostname(): sy
- 日志文件对于一个服务器来说是非常重要的,它记录着服务器的运行信息,许多操作都会写日到日志文件,通过日志文件可以监视服务器的运行状态及查看服务
- 安装环境:CentOS7 64位 MINI版,安装MySQL5.71、配置YUM源在MySQL官网中下载YUM源rpm安装包:http://
- Python使用for实现无限循环# 方法1.1:借助循环遍历列表的cycle方法from itertools import cyclefo
- 本文实例为大家分享了python实现雨滴下落到地面效果的具体代码,供大家参考,具体内容如下本程序在Windows 64位操作系统下,安装的是
- 近期在使用bootstrap这个优秀的前端框架,这个框架非常强大,框架里面有下
- Oracle提供了不少方法用于数据空间的使用、监控和维护,同时也在各版本中陆续对这方面的功能进行了增强,目的在于简化这方面工作的复杂度,提高
- 花了两周时间,利用工作间隙时间,开发了一个基于Django的项目任务管理Web应用。项目计划的实时动态,可以方便地被项目成员查看(^_^又重
- map是key-value数据结构,又称为字段或者关联数组。类似其他编程语言的集合一、基本语法var 变量名 map[keyty
- 图片版PDF无法复制,转化成文字版的PDF后使用更方便. 我们需要用到python3.6,pypdf2,ghostscript,Python