Vue.js 中 el-input 取消焦点事件详解

在 Vue 项目中，您可以使用 `ref` 属性来获取 `el-input` 组件的 DOM 对象，然后使用 `blur()` 方法来取消焦点。具体步骤如下：

1. 在 `el-input` 组件上添加一个 `ref` 属性，例如 `ref='myInput'`。
2. 在组件的 `methods` 选项中，定义一个取消焦点的方法，例如 `cancelFocus`。
3. 在 `cancelFocus` 方法中，使用 `this.$refs.myInput.blur()` 来取消焦点。
4. 在 `el-input` 组件上添加一个 `@blur` 事件监听器，将其绑定到 `cancelFocus` 方法。

完整的示例代码如下所示：

<template>
  <el-input ref='myInput' @blur='cancelFocus'></el-input>
</template>

<script>
export default {
  methods: {
    cancelFocus() {
      this.$refs.myInput.blur();
    }
  }
}
</script>

在上述示例中，当 `el-input` 组件失去焦点时，会调用 `cancelFocus` 方法，该方法会使用 `this.$refs.myInput.blur()` 来取消焦点。