最近，在使用ant design vue开发项目，element ui已经不更新了，于是使用ant design vue。

用到了Popover气泡卡片，发现ant-popover-inner-content设置了padding: 12px 16px;。于是出现了如下效果：

而我理想状态应该是

于是设置css如下所示：

<style rel="stylesheet/scss" scoped>
.ant-popover-inner-content{
padding:0;
}
</style>

发现，设置无效，如果把scoped去掉就行，但这不是我想要的，我不想影响其他组件。

调试界面，发现，popover把代码渲染到了body里，这样就和我当前组件平级了。查api，发现了这样一个getPopupContainer参数，于是代码做了如下改动

<a-popover trigger="click" placement="bottomRight" :getPopupContainer="
  triggerNode => {
    return triggerNode.parentNode;
  }
">

getPopupContainer的作用是设置浮层渲染父节点，默认渲染到 body 上。

这样再改css样式。

<style rel="stylesheet/scss" scoped>
.navbar {
    /deep/ .ant-popover-inner-content{
         padding:0;
     }
}
</style>

就按照我的语气渲染了。