博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
element-ui el-input / el-select输入框的非空校验
阅读量:4143 次
发布时间:2019-05-25

本文共 1633 字,大约阅读时间需要 5 分钟。

一、之前写的实现

直接js判断就可以 

.prevent .stop 是阻止继续冒泡  不一样的 

见 官方说明 1 

2 自定义 (我没看)

3  这个网址很好  我的项目里面就这样写的 

 next() {      this.$refs["firmForm"].validate(valid => {        if(!valid)          console.log("表单填写不完整  不通过");        else           this.active++;      });     // this.$refs['firmForm'].clearValidate();    },

===========================================

根据 链接3 的 介绍 写了一个判断

然后发现有一丢丢的小问题   嗯 一个很坑的bug

先看代码  prop那里 需要和v-model 是一样的  

不然获取不到。。。一直说空  这边有点不清不楚的。qwq 

html

js

二、后面发现select的问题

先说明,测试给 的bug,前端可以打回。

原型图不需要,或者无需更改。正常产品原型图上会比较详细到这种细节

 
element-ui里

之前发过的校验,原来是 element -ui里面自带的。

而且 可以补message 不必写个长长的函数(但是只能校验非空。可以一起用)前面那个check  是检查空的 也可以与别的

如果只是检查非空的话可以方便一点

如果写required:true的话前面有星号,可以不写,直接一起用一个validation。

  rules2: {  

        accountOpeningBranch:[{validator: checkUnempty2, message: '开户支行不能为空!',trigger: "blur"}],

      }

发现我使用搜索引擎的效率真的好低。qwq。所以多问问还是有必要的,在你最终知道之前

el-option里面

qwq。 这个 难怪你搜不到。叫做vue elementUI 表单校验(多层嵌套)

我在谷歌搜的是 el-form-item  下三个model 如何正则校验

好。先看看~回来补

结果qwq  我写了两个小时 没有解决这个问题!!!!!!!!什么鬼啊

 

是这样的  多重校验其实还好 见  https://www.okcode.net/article/40176 用下面那个方法

但是 问题是 blur不生效 但是校验的时候submit会校验出来,也会触发原生非空事件,本来还好,但是红色框框不会自动消失。

那么用trigger:  change  这个的问题则是 选了第一个 就告诉你没选全  因为触发change 了

..................................................................

搜索的大概要select  blur无效/? 我 的心好累

校验其实倒是好说 可以在需要call back的 const函数里面乱搞。 qwq。

关于测试那些问题我觉得完全可以加一些什么小字段校验。什么submit 了之后 某个地方true  然后巴拉巴拉

 

可是何必呢qwq? 流程里面一堆bug

anyway,不具有探索精神的我,玩游戏喜欢集齐图鉴而不是把装备做到最好_(:з」∠)_

掰掰,改流程bug去了

转载地址:http://uouti.baihongyu.com/

你可能感兴趣的文章
apache和tomcat整合
查看>>
java虚拟机错误问题
查看>>
oracle建立表空间
查看>>
oracle分区表的性能提升
查看>>
"Cannot allocate memory" OutofMemory when call Ant to build Polish project in Tomcat
查看>>
dumpcap抓包(python)
查看>>
查看文件是否被其他进程访问
查看>>
字符编码详解
查看>>
python使用dpkt分析wireshak报文(Modbus规约)
查看>>
css中的IFC
查看>>
CentOS 6.5下 mysql用户root登录不了
查看>>
windows + tomcat 部署web服务 http 改为https访问方法
查看>>
Windows系统下Apache 服务器启动以及过程中产生问题的解决办法
查看>>
Oracle服务说明
查看>>
异常收集(三):Missing artifact com.oracle:ojdbc6:jar:1.0 两种解决方案
查看>>
异常收集(四):Plugin execution not covered by lifecycle configuration
查看>>
异常收集(五):Io 异常: The Network Adapter could not establish the connection
查看>>
JSP中的转义字符
查看>>
SQLException: The user specified as a definer ('root'@'%') does not exist
查看>>
Linux 操作指令收集
查看>>