el-input 设置类型为number时,输入中文后光标会上移,并且会出现上下箭头

光标上移

设置 el-input 的 type='number'后,只能输入数字,输入中文后会自动清空,但是会出现一个问题:【光标会上移,如下图】

el-input 设置类型为number时,输入中文后光标会上移,并且会出现上下箭头_第1张图片

解决方法:修改样式

注意:需要使用样式穿透   :deep( )

/*解决el-input设置类型为number时,中文输入法光标上移问题*/
 :deep(.el-input__inner){
    line-height: 1px !important;
} 
输入框后面会出现上下箭头

设置 el-input 的 type='number'后,输入框后面会出现上下箭头:【如下图】

 解决方法:修改样式   

注意:需要使用样式穿透   :deep( )

/* 解决el-input设置类型为number时,去掉输入框后面上下箭头*/
 :deep(input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button) {  
	 -webkit-appearance: none;  
	 margin: 0;  
}

你可能感兴趣的:(vue.js,elementui,css)