Vee-validate: Cannot validate a file in v3

[AdrienPoupa]

I want to apply the required rule on a file input, and validate its extension.

It seems to be straightforward in v2, but I cannot get it to work on v3.

v2: https://jsfiddle.net/cqod20vb/

v3:

import { required, email, oneOf, ext } from "vee-validate/dist/rules";

extend("required", required);
extend("email", email);
extend("oneOf", oneOf);
extend("ext", ext);

<ValidationObserver ref="form">
                        <ValidationProvider name="cv" rules="required|ext:pdf,doc,docx" v-slot="{ errors }">
                            <input type="file" name="cv" @change="addCv" ref="cvInput">
                            <p>{{ errors[0] }}</p>
                        </ValidationProvider>
                    <div class="action">
                        <a><div class="button" @click="submit">Submit</div></a>
                    </div>
                    </ValidationObserver>

        data() {
            return {
                cv: [],
            }
        },
        methods: {
            async submit() {
                const isValid = await this.$refs.form.validate();
                if (isValid) {
                    console.log('submit');
                } else {
                    console.log('abort');
                }
            },
            addCv: function() {
                this.cv = this.$refs.cvInput.files;
            }
        }

I add a file, click on submit, but it says that the field is required even though there is a file in the input, and my cv attribute is filled. I tried to populate it with the File directly it does not work either.

If I remove the required, then the ext does not validate anything.

Am I missing something obvious?

The documentation is scarce and does not seem to include sample for rules anymore.

Thanks

[logaretm]

It does, here you go:

https://logaretm.github.io/vee-validate/api/rules.html

Here is an example:

https://jsfiddle.net/logaretm/95s4f6z0/

We are currently re-structuring the docs.

[AdrienPoupa]

You're right, sorry and thanks. I was missing the validate in v-slot and @change="validate".

I did not notice the API section from the Guide https://logaretm.github.io/vee-validate/guide/

The Validation Rules should be in the Guide imo.