select 默认展开所以项

要实现 select 组件默认展开所有选项，可以使用 `popper-append-to-body` 属性，将下拉选项的弹出层插入到 body 元素中。

示例代码:

<template>
  <div>
    <el-select
      v-model="selectedValue"
      multiple
      :popper-append-to-body="false"
      @visible-change="handleVisibleChange"
    >
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedValue: [],
      options: [
        { value: 'A', label: 'Option A' },
        { value: 'B', label: 'Option B' },
        { value: 'C', label: 'Option C' }
      ]
    };
  },
  methods: {
    handleVisibleChange(visible) {
      if (visible) {
        // 默认展开所有选项
        this.$nextTick(() => {
          this.$refs.select.toggleMenuVisible();
        });
      }
    }
  }
};
</script>

在上面的代码中，我们使用了 `@visible-change` 事件监听下拉框的显示状态变化，当下拉框展示时，使用 `$refs.select.toggleMenuVisible()` 方法来切换下拉框的显示状态，从而达到默认展开所有选项的效果。需要注意的是，这里使用了 `multiple` 属性来展示多选下拉框，如果是单选下拉框，可以将 `multiple` 属性去掉。

希望这个解决方案对你有帮助！