Vee-validate：“不存在这样的验证器‘required_if’。”

Question

我正在使用

vee-validate

v3 和 Vue 2.7。具体来说，这是我的

vee-validate

中的

package.json

条目：

"vee-validate": "^3.4.5",

我无法让

required_if

规则发挥作用。当我尝试使用它时，我收到错误

Uncaught (in promise) Error: No such validator 'required_if' exists.

这是代码：

<ValidationObserver>
  <ValidationProvider rules="" vid="country" v-slot="x">
    <select v-model="country">
      <option value="US">United States</option>
      <option value="OTHER">Other country</option>
    </select>
  </ValidationProvider>

  <ValidationProvider rules="required_if:country,US" v-slot="{ errors }">
    <input type="text" placeholder="state" v-model="state" />
    <span>{{ errors[0] }}</span>
  </ValidationProvider>
</ValidationObserver>

您可能会注意到，这实际上基本上是他们在

https://vee-validate.logaretm.com/v3/guide/rules.html

上的 required_if 规则文档中给出的确切示例。我不明白我在这里做错了什么才会出现这个错误。

Answer 1

您必须导入这些规则，它们默认不安装

您可以在组件中添加这些行：

import { required_if } from "vee-validate/dist/rules";
import { extend } from "vee-validate";
extend("required_if", required_if);

或者您可以创建一个插件文件并添加所有默认未安装的规则

import { extend } from 'vee-validate';
import * as rules from 'vee-validate/dist/rules';

Object.keys(rules).forEach(rule => {
 extend(rule, rules[rule]);
});

for (let [rule, validation] of Object.entries(rules)) {
 extend(rule, {
  ...validation
 });
}

参考：https://vee-validate.logaretm.com/v3/guide/rules.html