el-popover 中 :hover不生效

你好！对于 `el-popover` 组件，`:hover` 伪类选择器是不起作用的。这是因为 `el-popover` 组件的内容是被渲染到页面的其他地方，并不是直接在组件内部进行渲染的。所以，在 `el-popover` 组件上使用 `:hover` 是无效的。

如果你想实现鼠标悬停时显示 `el-popover` 的效果，可以考虑使用 JavaScript 或者 Vue 的事件绑定来实现。你可以在需要触发 `el-popover` 的元素上绑定鼠标移入和移出事件，然后通过相应的事件处理函数来控制 `el-popover` 的显示与隐藏。

以下是一个示例代码：

<template>
  <div>
    <button @mouseenter="showPopover" @mouseleave="hidePopover">Hover me</button>
    <el-popover ref="popover" trigger="manual">
      <p>Popover content</p>
    </el-popover>
  </div>
</template>

<script>
export default {
  methods: {
    showPopover() {
      this.$refs.popover.showPopper = true;
    },
    hidePopover() {
      this.$refs.popover.showPopper = false;
    },
  },
};
</script>

在上述代码中，我们通过 `@mouseenter` 和 `@mouseleave` 事件来触发显示和隐藏 `el-popover`，并通过 `$refs` 引用到 `el-popover` 组件实例，然后通过修改 `showPopper` 属性来控制 `el-popover` 的显示与隐藏。

希望这个解决方案对你有帮助！如果还有其他问题，请随时提问。