带有v-model的input 保证内容是非负整数,键盘输入适用
输入小数时自动四舍五入成整数,输入负数时自动变0
遇到的坑:
不太会vue,一直按照普通input搞得,给input的value赋值,以为就完了,结果输入小数后,确实立刻变成了整数,但是光标一失去焦点,又变回了小数 (〝▼皿▼),因为v-model里的数没变_(¦3」∠)_
<input id="order" type="number" min="0" onkeyup="checkNum(event)"
v-model="menu.orderNum" placeholder="排序号"/>
<script type="text/javascript">
var vm = new Vue({
el:'#rrapp',
data:{
showList: true,
title: null,
menu:{
parentName:null,
parentId:0,
type:1,
orderNum:0
}
},
methods: {}
});
//这个方法写methods里也行,懒得改了
function checkNum (e) {
var val = e.target.value;
e.target.value = val >= 0 ? val : 0;
var flag = new RegExp("^[1-9]([0-9])*$").test(val);
if(!flag){
vm.menu.orderNum = Math.round(val);
}
}
</script>