Configuration / options does not seem to take effect

[simplenotezy]

I have tried customizing the options, like below:

    ['nuxt-validate', {
        lang: 'en',
        rules: ['email', 'min', 'max', 'confirmed'],
        nuxti18n: {
            locale: {
                'da': 'da',
                'en': 'en'
            },
            rules: ['email', 'min', 'max', 'confirmed']
        },
        events: 'change',
        classes: {
            valid: 'is-success',
            invalid: 'is-danger'
        }
        // regular vee-validate options
        // https://github.com/logaretm/vee-validate/blob/master/docs/configuration.md
    }],

But classes / events are not being registered. What am I doing wrong?

[simplenotezy]

Actually, it's now called "mode" instead of "events" it seems - and that works perfectly.

The "classes" property is the one not working.

[simplenotezy]

If I inspect the input it has classes, but it does not use the class-names provided in the config. It uses the native: "invalid" instead of "is-danger"

[sowinski]

@simplenotezy Did you find a way to use classes?

[itgelo]

Have you tried an option like this? nuxt.config.js

...
classes: true,
classNames: {
      valid: 'is-success',
      invalid: 'is-danger',
},
...

component

<ValidationProvider v-slot="{ classes, errors }" name="email" rules="required|email">
    <div class="control" :class="classes">
        <input v-model="email" type="text" placeholder="type some email" />
        <span>{{ errors[0] }}</span>
    </div>
</ValidationProvider>