在我们的Vue应用程序中，我们使用Vuelidate进行表单验证。有这种行为，即字段仅在表单提交中进行验证，就像页面呈现时一样进行验证，如文档中所述，在提交处理中使用$ v.invalid和$ v.touch（）。奇怪的是，在实现它的某些页面中，它运行良好。但是有时，在其他页面中，它将以我不希望的方式进行验证，但是我看不到如何解决这个问题。有人经历过这个吗？一些代码片段。

 <input
      id="name"
      type="text"
      name="name"
      v-model="form.name"
      :class="{
        invalid:
        !$v.form.name.required || !$v.form.name.minLength,}"
 />

我的数据对象和验证

data: {
      form: {
      name: '',birth: '',parentage: '',}
 },validations: {
   form: {
      name: { required,minLength: minLength(4) },}

提交方法

async submit() {
  this.$v.touch();
  if (!this.$v.$invalid) {
    console.log('Submit');
  }
}