为什么 Vuetify 规则在延迟验证中未设置为 0？答案

【问题标题】：why Vuetify rule take 0 as not set in lazy validation?为什么 Vuetify 规则在延迟验证中未设置为 0？
【发布时间】：2020-04-06 05:36:20
【问题描述】：

我正在从 API 分配默认值，但是当 v-text-field 的值为 0 时，:rules 标记将其视为未设置：image

这是我的代码

<v-col cols="12" sm="6" md="4">
    <v-text-field type="number"  :rules="incapacidadRules" min="0" v-model="editedItem.incapacidad" label="Incapacidad"></v-text-field>
</v-col> 
<v-col cols="12" sm="6" md="4">
    <v-text-field type="number" min="0" :value="editedItem.descanso"  :rules="descansosRules" v-model="editedItem.descanso" label="Descansos"></v-text-field>
</v-col> 
<v-col cols="12" sm="6" md="4">
    <v-text-field type="number" min="0"  :rules="permisosRules" v-model="editedItem.permiso" label="Permisos"></v-text-field>
</v-col>

和我的规则

incapacidadRules: [
    v => !!v || 'Incapacidad Requerido'
],
descansosRules: [
    v => !!v || 'Descansos Requerido'
],
permisosRules: [
    v => !!v || 'Permisos Requerido'
],

当我手动将值设置为 0 时，规则没有问题。

【问题讨论】：

标签： vue.js vuetify.js vee-validate

【解决方案1】：

0 是falsy。所以!!0 == false。对于您的规则，也许使用typeof v === "number" ? v : 'Incapacidad Requerido' 而不是!!v。

【讨论】：

【解决方案2】：

考虑 !~a 是 true 代表 a >= 0 和 false 代表 a < 0。

【讨论】：

【解决方案3】：

我可以解决这个问题：正如 Tanner 提到的 0 是假的，所以当你将值设置为

editItem(item){
    this.editedItem.faltas=item.faltas;
}

如果item.faltas 为 0，则 v-text-field 被识别为 false，但与 0 不同的值没有问题。因此，您需要始终将值设置为字符串：

editItem(item){          
    this.editedItem.faltas=`${item.faltas}`;
}

【讨论】：