<el-input-number v-model="num"></el-input-number>
在data中的num变量可以设置为undefined,来改变计步器的初始值为空,但是如果您的场景是在data中一个对象的属性值,例如:
`<el-input-number v-model="form.num"></el-input-number>`
绑定的是data中form对象的一个属性值,如果是这种使用场景,就无法绑定undefined来初始化为空了。 这个时候我目前有两种解决办法,使用change事件,绑定基本变量,然后去事件回调中赋值:
<el-input-number v-model="num" @change></el-input-number>
// data中的的num为undefined
data(){
return{
num:undefinded,
form:{
num:''
}
}
}
// 事件
change(val){this.form.num=val}
事件中这样就可以实现初始化为空,并在值改变时绑定上你需要的对象属性,但是注意!!!这里的chang事件需要输入框失焦才能监测到变化,触发change事件!第二种方式可以直接使用普通输入框,并添加校验:
<el-form-item label="数字输入框" prop="numberInput"> <el-input v-model="form.numberInput" placeholder="请输入数字"></el-input> </el-form-item>
// 校验:
numberInput: [
{ required: true, message: '请输入数字', trigger: 'blur' },
{ validator: (rule, value, callback) => {
if (value && !/^\d+(\.\d{1,6})?$/.test(value)) {
callback(new Error('请输入数字,小数点后最多六位'));
}
else {
callback();
} }, trigger: 'blur',
},
]
如果有问题或方式,请指正,谢谢啦!