关于input [type=number]时上下的操作按钮（数值增加/减少操作按钮）不显示问题

使用到的ui库 ：quasar    框架：vue

问题：

在做项目时，发现给input加type=number，失效了，上下箭头按钮没有出现

html

<q-input v-model.number="value"
          type="number"
          maxlength="4"
          :max="9999"
          :min="1"
          outlined>
</q-input>

本来应该是这样的

结果却是这样的（没有两个上下图标可操作），只是手动输入，不能点击增加/减少

 

解决方法：给input加上如下css代码即可

css

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  appearance: button !important;
}