vue3 el-table tooltip触发，切换页面，导致提示信息不消失悬停左上角

在 Vue3 中，当使用 Element UI 的 `el-table` 组件结合 `tooltip` 功能时，如果表格内容动态并且用户在页面滚动或切换时，原本悬浮的 tooltip 可能不会自动关闭。这是因为默认情况下，Vue 的响应式更新并不会实时移除已离开可视区域的 tooltip。

解决这个问题通常需要手动处理这种情况，例如添加自定义事件监听或者使用一些第三方库（如 `vue-flickity-popover` 或者 `vue-touch-tooltip`），它们可以在组件卸载或者失去焦点时清理 tooltip。另一种常见做法是在离开元素前设置一个定时器，检查 tooltip 是否还在当前视口中，不在则清除它。

下面是一个简单的示例：

<template>
  <el-table :tooltip-method="customTooltipMethod" ...></el-table>
</template>

<script>
export default {
  methods: {
    customTooltipMethod(trigger, content, pos) {
      const tooltip = this.$refs.tooltip;
      if (!tooltip || !this.isElementInViewport(pos)) {
        tooltip && tooltip.clearTimer();
        return false;
      }
      // 此处可以执行你的原生 tooltip 显示逻辑
    },
    isElementInViewport(element) {
      const rect = element.getBoundingClientRect();
      return (
        rect.top >= 0 &&
        rect.left >= 0 &&
        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
        rect.right <= (window.innerWidth || document.documentElement.clientWidth)
      );
    },
  },
};
</script>

在这个例子中，`customTooltipMethod` 检查 tooltip 是否在视口内，如果不是，则清空定时器并关闭 tooltip。`isElementInViewport` 函数用于判断元素是否在窗口可视区域内。