如何禁用输入数字的旋转按钮？

Question

我试图在Vue中使用typescript使用createElement（）添加输入类型编号的元素。 有没有办法禁用旋转按钮进行增量和减量？ 我已经尝试使用：

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer.spin-button {
-webkit-appearance: none;
margin: 0;
}

但是在构建和部署之后，我看不到更改。

谢谢

Answer 1

这一直持续到最近。 我向CSS选择器添加了display: none;。 现在是这样：

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer.spin-button {
  display: none;
  -webkit-appearance: none;
  margin: 0;
}

Answer 2

问题只是你的 CSS 有错别字。 -webkit-outer.spin-button 应该是 -webkit-outer-spin-button。完整的事情是：

input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

仅供参考，对于我的用例，我刚刚发现 here 是一个比隐藏按钮更好的选择，它可能也适用于您：

<input type="text" inputmode="numeric" pattern="[0-9]*">