el-tabel中下拉框添加悬浮title

碰到一个需求，需要在表格内下拉框添加悬浮title
原先是这样，当选择名称过长的看不到全称所以想加个悬浮，首先想到tooltip

 实现如下

<el-tooltip :content="hoverContent" placement="top">
    <el-select-v2
      v-model="selectedProjectId"
      :options="projectOptions"
      filterable
      clearable
      class="cus-el-select-v2"
      size="small"
      @change="handleSelectChange"
    >
    </el-select-v2>
  </el-tooltip>
const hoverContent = ref<string>("");
const handleSelectChange = (value: string) => {
  const selectedOption = props.projectOptions.find(
    (option) => option.value === value
  );
  if (selectedOption) {
    hoverContent.value = selectedOption.label || "无信息";
  } else {
    hoverContent.value = "无信息";
  }
};

<el-select-v2
    :title="hoverContent"
    v-model="selectedProjectId"
    :options="projectOptions"
    filterable
    clearable
    class="cus-el-select-v2"
    size="small"
    @change="handleSelectChange"
  >
  </el-select-v2>

 也可以使用title就是样式不太好

给option选项也加上title

<el-select-v2
    :title="hoverContent"
    v-model="selectedProjectId"
    :options="projectOptions"
    filterable
    clearable
    class="cus-el-select-v2"
    size="small"
    @change="handleSelectChange"
  >
    <template #default="{ item }">
      <span :title="item.label">{
  
  { item.label }}</span>
    </template>
  </el-select-v2>

大功告成