Ant Design Pro项目Popover位置微调

前情

公司有经常需要做一些后台管理页面，我们选择了Ant Design Pro，它是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案。

产品效果图

最新接到的一个后台管理界面需求，需要使用到Popover，但是在使用时发现那箭头位置不符合预期：

理想：

实际：

解决方案

从官网文挡并没有找到相关的调整位置的配置项，一开始想通过加margin、transform都失败告终，最后发现可以通过配置align的offset可以实现位置微调。

关键代码：

<Popover 
    align={{
      offset: [18, 10]
    }} 
    placement="bottomRight" 
    content={content} 
    overlayClassName="comments-more-wrap" 
    trigger="click" 
    open={openReportBtn} 
    onOpenChange={handleOpenChange}
  >
    ...
  </Popover>