Vuelidate如何允许空值或空字符串通过minValue(0)校验？

问题核心：可选字段留空时，minValue(0)会将空值（空字符串、null等）判定为不合法，导致错误触发。需要实现「空值合法，非空值必须≥0」的校验逻辑。

方案一：使用组合验证器（推荐） #

通过or组合isEmpty和minValue(0)，实现「要么为空，要么值≥0」的规则：

1. 导入所需验证器：

import { minValue, isEmpty, or } from 'vuelidate/lib/validators'

2. 更新校验规则：

validations: {
  company_name: {
    valid: or(isEmpty, minValue(0))
  }
}

3. 修改模板的错误类判断：

<input
  id="company_name"
  v-model="company_name"
  type="number"
  min="0"
  step="0.01"
  :class="{ 'error': v$.company_name.valid.$invalid }"
>

方案二：自定义验证函数 #

直接编写自定义校验逻辑，空值时跳过minValue校验：

validations: {
  company_name: {
    minValue: (value) => {
      // 空值（空字符串、null、undefined）直接通过校验
      if (!value && value !== 0) return true;
      // 非空时校验是否≥0
      return minValue(0)(value);
    }
  }
}

模板可保持原有错误判断不变：

<input
  id="company_name"
  :value="company_name"
  type="number"
  min="0"
  step="0.01"
  :class="{ 'error': v$.company_name.minValue.$invalid }"
>

注意：若使用:value而非v-model，需确保company_name的值能正确同步到组件数据中，否则Vuelidate无法获取最新值进行校验。

内容的提问来源于stack exchange，提问作者MarkBurns