vue2 输入框禁止输入特殊字符

在 Vue.js 中，如果你想在 input 标签内限制用户输入特殊字符，可以利用 `v-model` 挑选合适的验证策略。你可以创建一个自定义指令（custom directive），例如 `no-special-chars`，或者直接在模板上添加事件处理程序。

这里是一个简单的例子：

<template>
  <input v-model="inputValue" :specialChars.prevent="true">
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
    };
  },
  directives: {
    specialChars: {
      bind(el, binding) {
        el.addEventListener('input', function(e) {
          const value = e.target.value;
          if (/[!@#$%^&*(),.?":{}|<>]/g.test(value)) { // 此正则匹配常见的特殊字符
            e.target.value = value.replace(/[!@#$%^&*(),.?":{}|<>]/g, ''); // 如果有特殊字符，则清除
          }
        });
      },
    },
  },
};
</script>

在这个例子中，`:specialChars.prevent` 指令会阻止输入含有特殊字符的值。如果用户试图输入一个特殊字符，它会被清除掉。