javascript - 如何在 vee-validate v3 中创建通用规则？

Question

是否可以创建通用验证规则以在多个元素中使用？

genericRule: {

required:'required',

min:'min',

etc..

}

在表格上

<ValidationProvider
  name="genericRule"
  rules="required|min|etc"
>
<input v-model='a'/>
</ValidationProvider>
<ValidationProvider
  name="genericRule"
  rules="required|min|etc"
>
<input v-model='b'/>
</ValidationProvider>

在版本 3 中，如果我在多个对象中重复相同的规则，我会得到 BAD 验证。

标签： javascriptvue.jsvee-validate

Answer 1

是的，您可以在多个ValidationProviders 中引用您的组件中定义的一组验证规则。你必须使用rules道具 ValidationProvider而不是name道具。

例如：

在模板中：

<ValidationProvider
  name="fieldA"
  :rules="genericRule"
>
    <input v-model='a'/>
</ValidationProvider>

<ValidationProvider
  name="fieldB"
  :rules="genericRule"
>
    <input v-model='b'/>
</ValidationProvider>

在组件中：

data() {
    return {
        genericRule: {
            required: true,
            min: 0,
            max: 100,
        }
    }
}