vue validator 扩展
1.问题:有个表单里面是表格,可以提交多行数据,每一行都有计划数ItemCount需要校验,校验标准是与同一行的另一个输入框Inventory的值比较,如果ItemCount>Inventory 就要有tip提示,不能用弹出框
参考 官网的例子 密码的二次验证 ,但我这里又不同,我是有多行验证的,我需要传参数到验证方法里。最终改良代码如下
<el-form-item :prop="'PPItems.' + scope.$index + '.itemCount'" :rules="[ {required: true,message: '数量不能为空', trigger: 'blur' }, {validator: validItemCount(scope.row), trigger:['blur','change']} ]" > <el-input-number v-show="!scope.row.ifClickSave" v-model="scope.row.itemCount" :precision="6" :min="0.000001" :max="scope.row.PP.inventory" class="number-kk" clearable controls-position="right" /> </el-form-item> //方法 methods: { // 数量验证规则 validItemCount(item) { return function(rule, value, callback) { if(value > item.PP.inventory || item.PP.inventory === 0){ callback(new Error('库存不足计划数')); } else { callback(); } }; }, }
效果如图

对于编程的技术和问题,需要熟练技术,需要总结问题,更需要举一反三的思索。哈哈,Me是一个元气满满的妹子~~

浙公网安备 33010602011771号