vue.js - 消息中未打印导入规则的参数 (min_value) - Vee-Validate/Vuetify

标签 vue.js vuetify.js vee-validate

我正在将 Vuetify 与 Vee-Validate 结合使用。我在我的组件中导入 vee-validate 和规则:

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}"
});

然后我的模板中有以下内容:

<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>

规则有效,但 {length} 参数未转换为数字。

enter image description here

最后,在文档中它说 min_value 是推断的。但是当我不提供 rules Prop 时它根本不起作用。来源https://logaretm.github.io/vee-validate/guide/rules.html#rules

最佳答案

找到问题了!

该参数称为 min 并且可以在文档中找到..

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

关于vue.js - 消息中未打印导入规则的参数 (min_value) - Vee-Validate/Vuetify,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60438717/

相关文章:

nuxt.js - 如何使用 vee-validate 本地化 Nuxt 的表单验证错误消息

validation - Vue js vee 使用自定义组件验证密码确认

vuetify.js - 如何将 vee-validate 4 (alpha) 与 Vuetify 结合使用进行验证?

javascript - 如何使用带有文本而不是 null/数字的 VuetifyJS 时间选择器组件?

vue.js - 如何在 vuetify 中的 v-for 中制作 v-skeleton-loader?

javascript - vue 中具有单个根元素的多个子组件

vue.js - VueJS 2 $emit 和 $on

vue.js - 如果搜索值为空 Vuetify,如何在 Combobox 中隐藏菜单?

webpack - 如何使用 Vuetify 的 Stylus CSS 类作为混入?

javascript - 我的 JavaScript 数据加载 promise 中需要 `setTimeout(resolve)` 做什么?