Vue.js Veutify v文件输入验证

Vue.js Veutify v文件输入验证,vue.js,vuetify.js,vee-validate,Vue.js,Vuetify.js,Vee Validate,我想验证是否使用vee validate的v-file-input和ValidationProvider选择了一个文件 下面是我的代码: <v-flex> <ValidationProvider rules="required" v-slot="{ errors }"> <v-file-input show-size accept=".xlsx" placeh

我想验证是否使用vee validate的v-file-input和ValidationProvider选择了一个文件

下面是我的代码:

<v-flex>
  <ValidationProvider rules="required" v-slot="{ errors }">
    <v-file-input
      show-size
      accept=".xlsx"
      placeholder="Click here to select your file"
      label="File name"
      :error="errors.length > 0"
      :error-messages="errors[0]"
      @change="selectFile"
    >
    </v-file-input>
  </ValidationProvider>
</v-flex>

不知何故,验证工作正常,但即使在我选择了一个文件之后,它也工作得太好了:


我不确定我做错了什么?

发现我必须这样做,不确定为什么我的上面没有工作:

rules: [
   v => !!v || 'File is required',
   v => (v && v.size > 0) || 'File is required',
]
我的表格:

<v-flex>
  <ValidationProvider :rules="rules" v-slot="{ errors }">
    <v-file-input
      show-size
      accept=".xlsx"
      placeholder="Click here to select your file"
      label="File name"
      :error="errors.length > 0"
      :error-messages="errors[0]"
      @change="selectFile"
    >
    </v-file-input>
  </ValidationProvider>
</v-flex>

在这里发布代码以帮助任何需要此代码的人