OverlayPanel 在错误的一侧显示箭头 (PrimeVue)

Question

我正在使用 overlay panels in the PrimeVue 框架，但有一个奇怪的问题我无法解决。

如演示页面所示，箭头在左侧：

但是我需要它在右边：

经过一些 google 搜索后，我找到了 this bug report，但由于某种原因我无法找到解决方案。

有人知道如何将箭头向右移动吗？

Answer 1

没有 属性 文档显示右侧的箭头。但是您可以尝试手动覆盖样式。箭头作为 .p-overlaypanel 容器的 :before 和 :after 元素应用。您需要定义更具体的样式以将箭头推向右侧。这可以完成，例如，如下所示：

<OverlayPanel class="my-panel">
</OverlayPanel
...

.p-overlaypanel.my-panel:before {
  right: 10px !important;
}

.p-overlaypanel.my-panel:after {
  right: 10px !important;
}