vue.js - 验证 v-file-input 验证
问题描述
我想验证是否使用 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>
https://codepen.io/subashdbc/pen/eYpVOKq
在此处发布代码以帮助需要此代码的任何人。