Vue + Element UI：如何为 `input` 输入框设置属性 `type` 为 `number` 去除右边的上下按键

在使用 Vue 和 Element UI 的过程中，有时候我们希望为 input 输入框设置 type 为 number，以便用户只能输入数字，但是，标准的浏览器数字输入框会有一个上下箭头的小控件，这个控件会提供微调数字的功能。然而，在某些情况下，我们可能不希望这个功能存在。
在 CSS 中，我们可以使用一些技巧来隐藏这个控件。这里是一个简单的例子：
HTML 部分：

<el-input v-model="number" type="number" input-class="custom-input"></el-input>

CSS 部分：

.custom-input::-webkit-inner-spin-button,
.custom-input::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n}

上述 CSS 代码将移除浏览器为 type=number 输入框提供的默认样式。注意，这种方法在所有浏览器中可能并不都有效，因为不同的浏览器可能会使用不同的默认样式。
如果你希望在所有浏览器中都隐藏这个控件，你可能需要使用一些 JavaScript 或者 jQuery 来动态修改这个控件的样式。这里是一个使用原生 JavaScript 的例子：

var input = document.querySelector('.custom-input');
input.setAttribute('type', 'text'); // 先将输入框类型改为文本，这样可以获取到上下箭头控件
input.nextSibling.style.display = 'none'; // 隐藏上下箭头控件
input.setAttribute('type', 'number'); // 最后再将输入框类型改回数字，恢复数字输入功能

上述 JavaScript 代码会获取到 .custom-input 的下一个元素（通常是上下箭头控件），然后将其隐藏。但是，请注意，这种方法可能会导致一些不可预知的问题，因为它会直接修改 DOM 元素。因此，在生产环境中使用这种方法时需要谨慎。
总的来说，隐藏数字输入框的上下箭头控件是一个比较复杂的问题，因为这涉及到浏览器默认样式的修改。最好的解决方案可能是使用自定义的数字输入控件，而不是直接修改标准的 input 元素。