Element: The min/max validation rule for el-input in [Bug Report] el-form is not effective.

Created on 15 Sep 2018  ·  2Comments  ·  Source: ElemeFE/element

Element UI version

2.4.7

OS/Browsers version

chrome 68.0.3440.106(正式版本) (64 位)

Vue version

2.5.17

Reproduction Link

https://jsfiddle.net/

Steps to reproduce

<el-form :model="ruleForm" :rules="rules" ref="ruleForm">
          <el-form-item label="测试:" prop="test">
            <el-input  placeholder="测试" v-model.number="ruleForm.test"></el-input>
          </el-form-item>
<el-form>

rules: {
    test: [
          {
            required: true,
            message: '测试数字',
            trigger: 'blur'
          },
          {
            type: 'number',
            min: 18,
            max: 18,
            message: '请输入18位纯数字',
            trigger: 'blur'
          }]
}

What is Expected?

v-model中使用number修饰符后,仍能使用规则中的min/max校验

What is actually happening?

v-model中使用number修饰符后校验规则不能校验值的最大值/最小值

Most helpful comment

type 为 number 的时候,校验的是数字的大小而非长度。不如直接设置 pattern 使用正则来校验。当然这里就没有必要用 number 修饰符了。

{
  pattern: /^\d{18}$/,
  message: '请输入18位纯数字',
  trigger: 'blur'
}

https://jsfiddle.net/zhiyang/hcknb7r2/8/

All 2 comments

Translation of this issue:

Element UI version
2.4.7

OS/Browsers version
Chrome 68.0.3440.106 (official version) (64 bits)

Vue version
2.5.17

Reproduction Link
https://jsfiddle.net/

Steps to reproduce
` '.



Rules: {

Test: [
{

Required: true,
Message: 'test number',

Trigger:'blur'
},

{
Type:'number',

Min: 18,
Max: 18,

Message: please enter 18 digit pure numbers.
Trigger:'blur'

]]]
}

` '.
What is Expected?

After using the number modifier in V-model, you can still use the min/max check in the rule.
What is actually happening?

After using the number modifier in V-model, the check rule can not check the maximum / minimum value.

type 为 number 的时候,校验的是数字的大小而非长度。不如直接设置 pattern 使用正则来校验。当然这里就没有必要用 number 修饰符了。

{
  pattern: /^\d{18}$/,
  message: '请输入18位纯数字',
  trigger: 'blur'
}

https://jsfiddle.net/zhiyang/hcknb7r2/8/

Was this page helpful?
0 / 5 - 0 ratings