删除 input 框的内容时不触发 blur 事件

可以通过监听 input 的 `input` 事件来实现这个功能。`input` 事件在输入框的内容发生变化时触发，但不会在输入框失去焦点时触发。你可以在 `input` 事件中处理输入框内容的变化，而不用担心触发 `blur` 事件。以下是一个示例代码：

<input id="myInput" type="text">

<script>
  const input = document.getElementById('myInput');

  input.addEventListener('input', () => {
    // 处理输入框内容的变化
  });

  input.addEventListener('blur', () => {
    // 处理输入框失去焦点的事件
  });
</script>

相关问题

el-input中clearable为true时点击清空会先处理clear事件，后面再点击任意地方则会触发blur事件，怎么避免blur事件在这种情况下触发

可以通过在 clear 事件中使用 `event.stopPropagation()` 方法来阻止点击 clear 按钮时触发的 click 事件继续冒泡到 el-input 上，从而避免触发 blur 事件。具体做法是，在 el-input 绑定 clear 事件，在事件处理函数中调用 `event.stopPropagation()` 方法，如下所示：

<el-input v-model="inputValue" clearable @clear="onClear"></el-input>

methods: {
  onClear(event) {
    event.stopPropagation();
    // do something else
    // ...
  }
}

这样，当用户点击清空按钮时，就不会触发 click 事件继续冒泡到 el-input 上，从而避免了触发 blur 事件的问题。

vue input 输入后触发blur

在 Vue 中，可以通过 `v-on:blur` 或 `@blur` 绑定事件监听 input 的 blur 事件，然后在事件处理函数中执行相应的操作。例如：

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

<script>
export default {
  data() {
    return {
      inputValue: ''
    };
  },
  methods: {
    handleBlur() {
      console.log('input blur');
      // 执行相应的操作
    }
  }
};
</script>

当输入框失去焦点时，会触发 `handleBlur` 方法，并执行其中的操作。