企业网站制造,si设计公司,wordpress 插件 摘要,wordpress摄影社uView表单校验带星号可以通过设置required属性来实现。在uView中#xff0c;可以使用组件来实现表单校验#xff0c;具体步骤如下#xff1a; 1、在需要校验的表单元素上添加required属性#xff0c;例如#xff1a;
u-form :modeldetailInfo refd…uView表单校验带星号可以通过设置required属性来实现。在uView中可以使用组件来实现表单校验具体步骤如下 1、在需要校验的表单元素上添加required属性例如
u-form :modeldetailInfo refdetailInfo :labelWidth133 :rulesrulesu-form-item label出车里程公里 propdrivingMileage requiredu-input v-modeldetailInfo.drivingMileage placeholder请填写数值 bordernone//u-form-itemu-form-item label回车里程公里 propreturnMileage requiredu-input v-modeldetailInfo.returnMileage placeholder请填写数值 bordernone//u-form-item
/u-form2、接着在需要校验表单的时候确保你调用了 validate 方法例如
this.$refs.detailInfo.validate().then(validate { console.log(校验通过);
}).catch(errors {console.log(校验失败);
})3、在上面的代码中我们为每个表单项设置了 prop 属性并且属性值与校验规则rules中的属性名一一对应。这样在调用 validate方法时就能正确地触发表单校验了。
data() {return {rules:{drivingMileage:[{type: number,required: true,message: 请填写出车公里数,trigger: [blur, change]}],returnMileage:[{type: number,required: true,message: 请填写回车公里数,trigger: [blur, change]}]}}},如果未触发 首先你需要确保你的表单组件 u-form 中添加了 ref 属性例如
u-form refdetailInfo/u-form
