<el-input style="width:50px" v-model="skuPc.effectiveTime" @keyup.native="number($event)"></el-input>
methods:{
笑晌number(e) {
console.log(e.target.value)
大或 let flag = new RegExp("^[1-9]([0-9])*$").test(e.target.value)
console.log(flag)
if (!flag) {
this.$message({
showClose: true,
message: "请输入正整数",
type: "warning"
})
}
}
}
为什么el-input要用@keyup.native?因为el-input是封装的组件,没有原生的keyup事件,如果换作input标签,可直接使用@keyup。
这样可以实现输入非正整数时的内容时实时提示,但是由于是keyup事件,会导致好几个message提示信息同时出现在页面上吗,不太友好。
2、换种事件,使用@blur
<el-input style="width:50px" v-model="skuPc.effectiveTime" @blur="number($event)"><el-input>
这样只有在输入框失焦时候提示错误信息,符合有好的用户体验要求碰仿锋。
项目需岩汪高求el-input组件输入的时候使用 v-model.number="value" 一开始可以输入任何字符。除非第一次输入为数字,后陵早面输入粗尺的内容才会被限制,只能输入数字。这个并不符合需求。
我们要实现如下功能:
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)