使用el-input的type属性设置为number,结构为
<el-input
type="number"
:controls="false"
size="mini"
min="0"
max="30"
v-model.number="addRuleForm.number">
</el-input>
但是设置成那个了,还有一个数量的控制键,有点小丑

然后就通过了css去掉这个控制键
.add-rule-dialog{
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}
}

然后就没了,就变成一个数字框了
本文介绍了如何利用el-input组件的type属性设置为number创建数字输入框,并通过CSS移除默认的增减控制键,实现简洁的数字输入效果。
1426

被折叠的 条评论
为什么被折叠?



