做网站用什么软件,保存网页的步骤,WordPress文章多图分页,订单详情页面设计背景#xff1a;
在onReady初始化规则 onReady() { this.$refs.uForm.setRules(this.rules); }, 同时#xff1a;ref,model,rules,props都要配置好。 报错
当input框限定type为number#xff0c;digit类型有初始值不做修改动作,直接提交会报错#xff0c;验… 背景
在onReady初始化规则 onReady() { this.$refs.uForm.setRules(this.rules); }, 同时ref,model,rules,props都要配置好。 报错
当input框限定type为numberdigit类型有初始值不做修改动作,直接提交会报错验证失败报空。 u-form-item label小时 label-width150 right-iconarrow-right prophours u-input placeholder请选择 typenumber classform-field-select v-modelmodel.hours/ /u-form-item 验证规则 data():{ return { model: {type: 年假, days: 0, reason: -, hours: 0,
},
rules: {type: [{required: true,message: 请输入请假类型,trigger: [change, blur],}],days: [{required: true,message: 请输入请假类型,trigger: [change, blur],}],hours: [{required: true,message: 请输入小时,trigger: [change, blur],}],reason: [{required: true,message: 请输入租赁洗涤价,trigger: [change, blur]}]// {min: 0,max:500, message: 不能小于0, trigger: [change, blur],}],
},}} 解决
方法1hours数字的字段加上数字正则匹配规则,限制只能0-999的数字且只能有2个小数。 hours: [{required: true,message: 请输入小时,pattern:/^(([1-9]\d{0,3})|0)(\.\d{0,2})?$/,trigger: [change, blur],}
] 方法2: hours: 先强制转成字符串再让其检验,如果不限制小数位数这个方法简单点 hours:[{required: true,
message: 请输入售价,
trigger: [change, blur],
// 正则检验前先将值转为字符串
transform(value) {return String(value);
},}] 源码
templateview classwrap stylepadding-bottom: 60px;u-tabs :listlist :is-scrollfalse :currentcurrent changechange/u-tabs!-- 当前套餐 --view v-ifcurrent 0u-form classform :modelmodel :rulesrules refuFormu-gap height20 bg-color#f5f5f5/u-gapu-form-item label请假类型 label-width150 right-iconarrow-right proptypeu-input placeholder请选择 typeselect classform-field-select v-modelmodel.type//u-form-itemu-gap height20 bg-color#f5f5f5/u-gapu-form-item label天数 label-width150 right-iconarrow-right propdaysu-input placeholder请选择 typetext classform-field-select v-modelmodel.days//u-form-itemu-gap height20 bg-color#f5f5f5/u-gapu-form-item label小时 label-width150 right-iconarrow-right prophoursu-input placeholder请选择 typenumber classform-field-select v-modelmodel.hours//u-form-itemu-form-item label结束时间 label-width150 right-iconarrow-rightu-input placeholder请选择 type classform-field-select//u-form-itemu-gap height20 bg-color#f5f5f5/u-gapu-form-item label请假事由 label-width150 propreason/u-form-itemu-form-itemu-input typetextarea placeholder请输入内容 v-modelmodel.reason//u-form-itemu-gap height20 bg-color#f5f5f5/u-gapu-form-item label图片 label-width150view soltright styleflex:1;text-align: right;align-items: center;i classadd-user iconfont icon-tupian/i/view/u-form-itemu-gap height20 bg-color#f5f5f5/u-gapu-form-item label选人处理人 label-width150view soltright styleflex:1;text-align: right;align-items: center;i classadd-user iconfont icon-zengjia/i/view/u-form-item/u-formu-row gutter32 classbottom-box justifycenteru-col span10viewu-button typeprimary shapecircle clicksubmitForm确定/u-button/view/u-col/u-row/view/view
/template
script
export default {data() {return {show: false,model: {type: 年假, days: 0, reason: -, hours: 1,},rules: {type: [{required: true,message: 请输入请假类型,trigger: [change, blur],}],days: [{required: true,message: 请输入请假类型,trigger: [change, blur],}],hours: [{required: true,message: 请输入请假类型,pattern:/^(([1-9]\d{0,3})|0)(\.\d{0,2})?$/,trigger: [change, blur],}],reason: [{required: true,message: 请输入原由,trigger: [change, blur]}]// {min: 0,max:500, message: 不能小于0, trigger: [change, blur],}],},list: [{name: 发起申请}, {name: 查看数据,}],m2mSimflowList: [],m2mOrderFlowList: [],current: 0,status: loadmore,iconType: circle,isDot: false,loadText: {loadmore: 点击加载更多,loading: 正在加载...,nomore: 没有更多了},}},onReady() {this.$refs.uForm.setRules(this.rules)},created() {},methods: {submitForm() {this.$refs.uForm.validate(valid {if (valid) {this.$u.toast(验证通过)} else {this.$u.toast(验证失败)}})},change(index) {this.current index;},navTo(url) {uni.navigateTo({url: url});}}}
