1.el-input设置type为number时,切换为中文输入法输入会让光标上移的问题解决
element的input框有个bug,就是当他设置类型时number的时候,你用中文输入法输入,点空格确定,他的光标会移动到上面去
解决前(效果图):
解决后(效果图):
解决方法:
<style>
/**
* 解决el-input设置类型为number时,中文输入法光标上移问题
**/
.el-input__inner{
line-height: 1px !important;
}
/**
* 解决el-input设置类型为number时,去掉输入框后面上下箭头
**/
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
</style>
2.el-element 中 input设置了type=“number“还能输入e和负数
解决方法:
οnkeypress=“return (/[\d]/.test(String.fromCharCode(event.keyCode)));”
<el-input v-model="queryForm.remainingCountBeg"
placeholder="剩余次数(起)" clearable type="number" maxlength="9"
onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)));">
</el-input>
3.禁止键盘上下键事件 ( 其实按键盘上下键还是可以让其变成负数 )
解决方法:
onMounted(() => {
// el-input type=number时,如果点击键盘上下可以改变input中的值,这个方法是禁止改变
document.onkeydown = function () {
if (window.event.keyCode === 38 || window.event.keyCode === 40) {
window.event.returnValue = false;
}
}
})
参考:https://blog.csdn.net/weixin_49035434/article/details/125390323