el-select @focus 事件没有弹出下拉框

<template>
  <el-select v-model="selectedValue" ref="select" @focus="handleFocus">
    <el-option label="Option 1" value="option1"></el-option>
    <el-option label="Option 2" value="option2"></el-option>
    <el-option label="Option 3" value="option3"></el-option>
  </el-select>
</template>

<script>
export default {
  data() {
    return {
      selectedValue: null
    };
  },
  methods: {
    handleFocus() {
      // 当 el-select 获取焦点时，展开下拉框
      this.$nextTick(() => {
        this.$refs.select.toggleMenu(true);
      });
    }
  }
};
</script>