Ant Design Vue 使用 a-form a-form-item 进行验证。

 <template>
  <div class="login">
    <a-form
      :form="form"
      :label-col="{ span: 6 }"
      :wrapper-col="{ span: 15 }"
      @submit="handleSubmit0"
    >
      <a-form-item label="姓名">
        <a-input
          placeholder="请输入姓名"
          v-decorator="[
            'realname',
            {
              rules: [{ required: true, message: '请输入姓名' }],
            },
          ]"
        />
      </a-form-item>

      <a-form-item :wrapper-col="{ span: 12, offset: 5 }">
        <a-button type="primary" html-type="submit"> 提交 </a-button>
      </a-form-item>
    </a-form>
 
  </div>
</template>
<script>
import { FormModel, FormItem } from "ant-design-vue";
export default {
  data() {
    return {
      form: this.$form.createForm(this, { name: "coordinated" }),
 
    };
  },
  methods: {
 
    // 个人基本信息
    handleSubmit0(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
        }
      });
    },
  },
};
</script>