2.4.7
chrome 68.0.3440.106(正式版本) (64 位)
2.5.17
<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'
}]
}
v-model中使用number修饰符后,仍能使用规则中的min/max校验
v-model中使用number修饰符后校验规则不能校验值的最大值/最小值
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'
}
Most helpful comment
type 为 number 的时候,校验的是数字的大小而非长度。不如直接设置 pattern 使用正则来校验。当然这里就没有必要用 number 修饰符了。
https://jsfiddle.net/zhiyang/hcknb7r2/8/