input输入框下拉el-popover，如何使得el-popover宽度和input保持一致，vue3

在Vue3中，可以使用`v-for`指令结合`el-popover`和`el-select`组件来实现input输入框下拉el-popover的效果，并使得它们的宽度保持一致。

首先，在template中，使用`el-select`组件来实现下拉框，并将其绑定到一个data中的数组上。然后，在下拉框中，使用`v-for`指令来循环遍历数组，将每个元素渲染为一个`el-popover`组件。在每个`el-popover`中，可以设置其宽度为和`el-select`相同。

以下是示例代码：

<template>
  <el-select v-model="selectedOption" placeholder="请选择" style="width: 200px;">
    <el-option v-for="(option, index) in options" :key="index" :label="option.name" :value="option.value">
      <el-popover
        placement="right"
        width="200"
        trigger="hover"
        v-slot="{ reference }"
      >
        <p>{{ option.description }}</p>
        <button @click="handleClick">点击</button>
      </el-popover>
    </el-option>
  </el-select>
</template>

<script>
export default {
  data() {
    return {
      options: [
        { name: '选项1', value: '1', description: '这是选项1的描述' },
        { name: '选项2', value: '2', description: '这是选项2的描述' },
        { name: '选项3', value: '3', description: '这是选项3的描述' },
      ],
      selectedOption: '',
    };
  },
  methods: {
    handleClick() {
      console.log('按钮被点击');
    },
  },
};
</script>