欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Elementui 表单验证rules定位到验证失败处

程序员文章站 2022-06-07 19:49:07
...
// 表单验证 
this.$refs.form.validate((valid, object) => {
          if (valid) {
           // 正确逻辑处理
            //alert('submit!')
          } else {
            let split = ''
            for (let i in object) {
              let dom = this.$refs[i]
              if (Object.prototype.toString.call(dom) !== '[object Object]') {
                //这里是针对遍历的情况(多个输入框),取值为数组
                dom = dom[0]
                // 第一个未填写必填项的表单被记录,这个是为了处理如何把校验未成功的第一个面板展开
                split = dom.prop
                let index = split.indexOf('.')
                let last = split.lastIndexOf('.')
                // 通过未填写的表单索引展开折叠面板
                this.activeName = Number(split.slice(index + 1, last))
                break
              }
              dom.$el.scrollIntoView({
                //滚动到指定节点
                block: 'center', //值有start,center,end,nearest,当前显示在视图区域中间
                behavior: 'smooth' //值有auto、instant,smooth,缓动动画(当前是慢速的)
              })
            }
            console.log('error submit!!')
            return false
          }
        }) 
相关标签: 前端踩坑合集