Vue 2 + Element UI 表单过长验证反馈不明显

<el-form ref="formRef" :model="form" :rules="rules">
  <!-- 很多 el-form-item 表单项 -->
</el-form>
<el-button @click="submitForm">提交</el-button>

methods: {
  submitForm() {
    this.$refs.formRef.validate((valid, fields) => {
      if (valid) {
        // ✅ 验证通过
        this.doSubmit()
      } else {
        // ❌ 验证失败：滚动到第一个错误字段
        this.scrollToFirstError(fields)
      }
    })
  },

  scrollToFirstError(fields) {
    this.$nextTick(() => {
      const firstField = Object.keys(fields)[0]
      const dom = this.$el.querySelector(`[prop="${firstField}"]`)
      if (dom && dom.scrollIntoView) {
        dom.scrollIntoView({ behavior: 'smooth', block: 'center' }) // 平滑滚动
      }
    })
  },

  doSubmit() {
    // 真正提交逻辑
  }
}