Parameter on imported rule (min_value) is not printed in the message - Vee-Validate/Vuetify

user_6033602 0
Viewed 1064

I am using Vuetify with Vee-Validate. I import vee-validate and the rule in my component with:

import { ValidationProvider, extend } from 'vee-validate';
import { min_value } from 'vee-validate/dist/rules';

extend('min_value', {
    ...min_value,
    message: "Must be higher than {length}"
});

Then I have the following in my template:

<ValidationProvider :rules="`min_value:${obj.min[selectedUnit]}`" v-slot="{ errors }">
    <v-text-field 
        v-model="obj.value[selectedUnit]"
        :label="key"
        ref="key"
        :min="obj.min[selectedUnit]"
        :max="obj.max[selectedUnit]"
        :error-messages="errors"
        :suffix="selectedUnit"
        outlined
        required
        type="number"
    ></v-text-field>
</ValidationProvider>

The rule works but the {length} parameter is not converted to a number.

enter image description here

Finally, in the docs it says that the min_value is inferred. But it doesnt work at all when I do not provide the rules prop. Source https://logaretm.github.io/vee-validate/guide/rules.html#rules

vee-validate vuetify.js vue.js
1 Answers

Found the problem!

The param is called min and can be found in the docs..

extend('min_value', {
    ...min_value,
    message: "Must be higher than {min}"
});
user_60336020
Related