vue判断el-input是否获取焦点

在Vue中，你可以通过监听`input`元素的`focus`和`blur`事件，或者使用Vue的特性来判断`el-input`是否获得了焦点。以下是几种常见的方式：

1. 直接监听DOM事件：

<template>
  <el-input @focus="inputFocus" @blur="inputBlur"></el-input>
</template>

<script>
export default {
  methods: {
    inputFocus() {
      this.isFocused = true;
    },
    inputBlur() {
      this.isFocused = false;
    },
    // 初始状态可以设置为false
    data() {
      return { isFocused: false };
    }
  }
}
</script>

现在`this.isFocused`将记录输入框是否聚焦。

2. 使用v-model结合计算属性：

<template>
  <el-input v-model="inputValue" ref="inputRef"></el-input>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
      focused: false,
    };
  },
  computed: {
    isFocused() {
      return this.$refs.inputRef && this.$refs.inputRef.$el === document.activeElement;
    }
  },
};
</script>

这里的`isFocused`会自动更新，当输入框获得焦点时变为`true`，失去焦点时变为`false`。