element-ui中form验证报错滚动到当前错误位置

这里将方法作为一个公用的js

1.建一个errorFieldFind.js

 方法代码如下：

import { Message } from 'element-ui'

export function errorFieldFind(message) {
  // 获取报错dom元素
  return new Promise((resolve) => {
    const isError = document.getElementsByClassName('is-error')
    setTimeout(() => {
      isError[0].querySelector('input').focus()
      Message.error(message)
      resolve()
    }, 100)
  })
}

2.页面应用

// 页面引入
import { errorFieldFind } from '@/utils/common/errorFieldFind'

// 方法调用
methods: {
    // 表单提交方法
    handleSumbit() {
      // 这里使用Promise，方便在其他组件内处理逻辑
      return new Promise(reslove => {
        this.$refs['form'].validate((valid, object) => {
          if (valid) {
            // 验证通过处理
            reslove(this.formInline)

          } else {
            // 获取报错验证信息
            const { message } = Object.values(object)[0][0]
            errorFieldFind(message)
          }
        })
      })
    }

element-ui验证报错跳转到相应位置