vue3 + element-plus。el-table 表头中使用 el-popover 遇到的问题。

问题描述：在有fix="left" 或 "right" 的列中按照官网给的例子，没有效果。

我的解决办法：封装一个trigger="click"的popover组件。不知道为什么写在同一个vue文件中没有效果。

<--子组件内-->
<template>
  <el-popover trigger="click">
    <slot><slot>

    <el-button size="mini" type="text" @click="btnClick('cancel')">取消</el-button>
    <el-button type="primary" size="mini" @click="btnClick('confirm')">确定</el-button>
    <template #reference>
      <span :id="myPopoverId">图标</span>
    </template>
  </el-popover>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
let id = 0;
export default defineComponent({
  setup(props, ctx) {
    const myPopoverId = 'myPopover_' + (++id)
    return {
      myPopoverId,
      btnClick(type: 'cancel' | 'confirm'){
        document.querySelect(`#${myPopoverId }`)?.click();
        ctx.emit(type)
      }
    }
  },
})
</script>

<--父组件调用子组件-->
<template>
  <el-table-column align="right">
      <template #header>
        表头
        <my-popover>xxx</my-popover>
      </template>
    </el-table-column>
</template>