el-table-column设置show-overflow-tooltip后，文字过长时tooltip离得太远

 分析：这是Element Plus中<el-table-column>的show-overflow-tooltip的一个已知限制，当内容超过单元格后，tooltip的弹出位置默认是基于DOM布局自动计算的，若内容是自定义模板内容或者嵌套层级复杂（如你用<el-popover>包着<span>）,tooltip可能会偏移较远。

解决方案：使用el-popover + 手动定位触发点

<el-table-column label="姓名" prop="realName" width="200">
  <template #default="scope">
    <el-popover
      placement="top"
      trigger="hover"
      :width="300"
      popper-class="custom-popover"
    >
      <!-- Popover 内容 -->
      <template #default>
        <div>
          <p>岗位：{{ scope.row.position }}</p>
          <p>电话：{{ scope.row.tel }}</p>
          <p>手机：{{ scope.row.phone }}</p>
          <p>邮箱：{{ scope.row.email }}</p>
        </div>
      </template>
      
      <!-- 触发区域（注意不要被裁剪）-->
      <div
        class="trigger-text"
        @mouseenter="checkOverflow($event, scope.row)"
      >
        <span v-if="scope.row._showPopover" class="ellipsis">{{ scope.row.realName }}</span>
        <span v-else>{{ scope.row.realName }}</span>
      </div>
    </el-popover>
  </template>
</el-table-column>

样式建议（保证布局正常）

.trigger-text {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.custom-popover {
  white-space: normal;
  word-break: break-all;
}

方法：只在内容溢出时才显示popover

checkOverflow(event, row) {
  const el = event.currentTarget;
  row._showPopover = el.scrollWidth > el.clientWidth;
}

 scrollWidth和clienWidth是DOM元素的两个常用属性，常用于判断内容是否超过容器、是否需要滚动条等。

clienWidth 元素内容区域的可视宽度宽度（包含内边距，不包含滚动条、边框、外边距）

scrollWidth 元素内容的总高度，包含溢出不可见部分