Element-UI关于input[type=number]的处理（去掉默认箭头样式、禁用滚轮事件、number类型值）

最新推荐文章于 2024-09-12 11:16:57 发布

王图图zZ

最新推荐文章于 2024-09-12 11:16:57 发布

阅读量1.1w

点赞数 2

分类专栏： element-ui 文章标签： input[type=number]

本文链接：https://blog.csdn.net/wangbiaozy/article/details/97856166

版权

element-ui 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

废话不多说了直接贴代码吧没啥技术含量

<el-form-item>
  <el-input clearable
            type="number"
            :disabled="disabled"
            @mousewheel.native.prevent     // 禁用鼠标滚轮事件
            @keyup.native="checkNum"
            v-model.number="agencyVisaCost">  //  v-model.number   vue修饰符 详见官方文档
  </el-input>
</el-form-item>

去掉input[type=number]默认上下箭头样式

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