uview框架u-form表单校验，rules校验对象中对象的值（解决当form属性嵌套
对。。。
当我们使⽤ uview 框架 u-form组件 进⾏表单校验时，代码如下
<!-- html代码-->
<u-form :rules="rules"ref="uForm":model="formData":label-width="210":errorType="errorType">
<view class="title">库存处理</view>
<view class="u-p-l-30 u-p-r-30 bg-white">
<u-form-item label="成品名称"prop="productName">
<u-input :disabled="true"v-model="formData.productName"input-align="right"placeholder="成品名称"/>
</u-form-item>
<u-form-item label="调整数量"prop="epStockDetail.num"required>
<u-input v-model="formData.epStockDetail.num"input-align="right"placeholder="请输⼊调整数量"/>
</u-form-item>
</view>
</u-form>
<!-- script 代码-->
export default{
data(){
return{
formData:{
productName:'',// 商品名称
epStockDetail:{
num:'',// 调整数量
}
},
// ⽂字提⽰
errorType:['message'],
// 校验
rules:{
productName:[{
validation框架
required:true,
message:'请输⼊商品名称',
trigger:'blur'
}],
'epStockDetail.num':[{
required:true,
message:'请输⼊调整数量',
trigger:'blur'
}],
}
}
}
}
此时，运⾏代码，还⽆法进⾏进⾏正确的校验，我们需要修改<u-form-item>组件中的部分源码
如下：
// 校验数据
validation(trigger,callback=()=>{}){
// 检验之间，先获取需要校验的值
// this.fieldValue = del[this.prop];
// 修改源码
this.fieldValue =FieldValue();
// blur和change是否有当前⽅式的校验规则
let rules =FilteredRule(trigger);
...
});
},
/**
* 修改源码新增此处⽅法
* 检验之前，先获取需要校验的值
* 解决：当form属性嵌套对象时未取到值的问题
* fix: [#I2AYUY](gitee/xuqu/uView/issues/I2AYUY)
*/
getFieldValue(){
const fields =this.prop.split('.');
const value = duce((pre, cur)=>{
return pre && pre[cur];
},del);
return value;
},
修改源码，增加校验前， 先获取需要校验的值，以便解决 对象数据中，因为对象嵌套，导致⽆法进⾏校验 的问题摘⾃

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。