数字输入框禁止输入 + - e，input number prevent - + e

最新推荐文章于 2026-03-28 03:13:58 发布

原创最新推荐文章于 2026-03-28 03:13:58 发布 · 953 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#vue

收录于

vue 专栏收录该内容

32 篇文章

订阅专栏

本文档展示了如何在Vue3中使用inputnumber组件时，通过监听键盘事件来阻止用户输入'e', '-' 和 '=' 等特定字符，以满足特定场景下的输入限制需求。

input number 类型下，+ - e . 都是允许录入的字符。在一些场景下，我们需要限制用户录入这些字符。

vue3 代码示例

<template>
<input type="number" @key.down="handleKey">
<template>
<script setup>
function handleKey($event){
  if (
    $event.code === 'KeyE' ||  // 禁止 e E
    $event.code === 'Minus' ||  // 禁止 - 
    $event.code === 'Equal'  // 禁止 + 
  ) {
    $event.preventDefault()
  }
}
</script>