element-plus表单校验模板以及回滚到错误区域

    <el-form
          ref="cateRef"
          :model="jobsForm"
          :rules="jobsRules"
          label-width="120px"
          size="default"
        >
         <el-row :gutter="10">
            <el-col :span="12">
              <el-form-item label="岗位类型" prop="job_type">
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>

配置好ref,model,rules以及'el-form-item'中的prop

cateRef.value.validate((valid, fields) => {
      if (valid) {
      } else {
        //自动滚动到未填写的字段中
        Object.keys(fields).forEach((key, i) => {
          const propName = fields[key][0].field
          if (i == 0) {
            cateRef.value.scrollToField(propName)
          }
        })
        elMessage('请填写必填字段', 'warning')
        console.log('error', fields)
      }
    })

JS部分直接CV就可用