vue 输入框禁止输入空格

在 Vue 的输入框中禁止输入空格，可以通过监听输入框的 input 事件，在事件处理函数中判断输入的字符是否为空格，如果是空格，则阻止默认事件。下面是一个示例：

<template>
  <div>
    <input type="text" v-model="inputValue" @input="handleInput" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
    };
  },
  methods: {
    handleInput(event) {
      const value = event.target.value;
      if (value.includes(' ')) {
        event.preventDefault();
        this.inputValue = value.replace(/ /g, '');
      }
    },
  },
};
</script>

在上述示例中，我们通过 v-model 指令将输入框的值与 inputValue 数据属性进行双向绑定。当用户输入字符时，会触发 @input 事件，然后在事件处理函数中判断输入的字符是否为空格，如果是空格，则使用 event.preventDefault() 阻止默认事件，并使用 String.prototype.replace() 方法将空格替换为空字符串，然后将新的值赋给 inputValue，这样就禁止了输入空格