el-form validate验证时自动滚动到错误项

需求： 弹窗或页面有多个表单验证项时，可能会由于拖动，看不到提示错误的项。

解决：

this.$refs.dialog_group_Add_modelForm.validate((valid, object) => {
  for (let o of Object.keys(this.dialog.rules)) {
    if (object.hasOwnProperty(o)) {
      if (this.$refs[o]) {
        this.$refs[o].scrollIntoView({
          behavior: "smooth",
        });
      }
      break;
    }
  }
  ...
  ...
  ...
  this.$message({ showClose: true, message: "操作中..", type: "info" });

其中，dialog_group_Add_modelForm是el-form的ref，this.dialog.rules是它的验证规则。
 

<el-form-item prop="PDA032">
  <span slot="label"
        ref="PDA032"
        class="hook_label">账号</span>
  <el-input class="w_200px"
            v-model="dialog.modelForm.PDA032"
            size="small"></el-input>
</el-form-item>

上述代码中，label的ref要和this.dialog.rules中的字段名称相同，hook_label这个class是用来微调滚动后的位置，一般是5px到8px左右。

.hook_label {
  padding-top: 5px;
}