element 表单验证不通过，滚动到验证提示的位置

第一种方法通过绑定ref做跳转

在方法中做校验

      // validate中、提供了两个参数：是否校验成功，和未通过校验的字段规则// 在需要验证的位置(el-form-item)加上ref，需要注意，这里的ref需要和prop的值一致。this.$refs.form.validate((valid,object) => {if (valid) callback(valid)else scrollView (object,this) // 表达验证失败滚动到固定地方})

//el-form绑定ref
<el-form ref="form" :model="formData" :rules="rules"><el-form-item label="联系电话：" prop="tel" ref="tel"><el-input v-model="tel" placeholder="请输入" /></el-form-item>
</el-form>

// 表达验证失败滚动到固定地方
export const scrollView = (object, _this) => {for (const i in object) {let dom = _this.$refs[i]// 这里是针对遍历的情况（多个输入框），取值为数组if (Object.prototype.toString.call(dom) !== '[object Object]') {dom = dom[0]}dom.$el.scrollIntoView({ block: 'center', behavior: 'smooth' })break // 因为我们只需要检测一项,所以就可以跳出循环了}
}

第二种方法通过Class去做跳转
验证错误后el-form-item 标签上会有一个类名 is-error 、通过获取元素来跳转

      this.$refs.xxx.validate((valid, object) => {if (valid) callback(valid)else moveToErr(this)})

export const moveToErr = (_this) => {_this.$nextTick(() => {const isError = document.getElementsByClassName('is-error')if (isError.length) isError[0].scrollIntoView({ block: 'center', behavior: 'smooth' })})
}