uview 1 uni-app表单 number digit 的输入框有初始化赋值后,但是校验失败

 背景:

在onReady初始化规则

onReady() {
            this.$refs.uForm.setRules(this.rules);
 },

同时:ref,model,rules,props都要配置好。

报错

当input框限定type为number,digit类型有初始值不做修改动作,直接提交会报错,验证失败:报空。

uview 1 uni-app表单 number digit 的输入框有初始化赋值后,但是校验失败_第1张图片

验证规则

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'],}],
},

}}

解决:

方法1:hours:数字的字段加上数字正则匹配规则,限制只能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);
},}]

源码:



                    
                    

你可能感兴趣的:(uni-app,java,前端)