Arco Design Vue 组件库中同时使用＜a-popover＞和＜a-tooltip＞出现闪动问题

原因：tooltip 组件和 Popover 组件都使用了相对定位来确定它们的位置，可能会导致它们之间的定位冲突。

鼠标移入时展示：

 点击按钮时展示：（这里的<a-tooltip>明显往左移动了一段距离，鼠标移出再移入时再点击又显示正常了）

 

这里题主使用样式解决了：

force-render={true}    加了这条属性貌似没啥作用

  <a-popover 
    trigger="click"
    position="br"
    content-class="FilterColumn"
    force-render={true}
    @popup-visible-change="handleShow"
  >
    <a-tooltip content="列设置" position="tr" class="aTooltip" arrow-class="aTooltipArrow">
      <icon-settings size="16" />
    </a-tooltip>
    <template #content>
      <div class="">
        需要展示的内容。。。。。。
      </div>
    </template>
  </a-popover >


<style lang="less">
  .FilterColumn{
    height: 300px;
    width: 200px;
    overflow: auto;
    .title{
      border-bottom: 1px solid #dcdfe6;
      padding-bottom: 8px;
    }
  }
  .aTooltip{
    width: 66px;
    left: auto !important;
    right:25px;
  }
  .aTooltipArrow{
    width: 10px;
    left: auto !important;
    right:5px;
  }
</style>

<style scoped>
  .arco-checkbox{
    margin: 5px 0;
  }
  .arco-checkbox-group{
    display: flex;
    flex-direction: column;
  }
</style>

解决完后的展示：