vue中输入框获取焦点事件

在Vue.js中，当输入框获得焦点时，可以使用`@focus`或`v-focus`指令来监听这个事件。`@focus`是基于HTML5的事件绑定，而`v-focus`则是Vue的特性，它会在元素聚焦时自动触发`focus`方法。以下是两个例子：

<!-- 使用HTML5原生事件 -->
<input type="text" @focus="handleFocusInput">

<script>
export default {
  methods: {
    handleFocusInput() {
      console.log('Input获得了焦点');
    }
  }
}
</script>

<!-- 使用Vue自定义指令 -->
<input v-focus="handleFocusInput" :ref="inputRefName">

<script>
export default {
  data() {
    return {
      inputRefName: 'myInput'
    };
  },
  methods: {
    handleFocusInput() {
      console.log(`${this.inputRefName}获得了焦点`);
    }
  }
}
</script>

在这个例子中，当你点击输入框或者通过程序设置`focus()`方法使其获得焦点时，对应的`handleFocusInput`函数会被调用。