全部 / 前端 / 技术 · 2022年9月22日 0

Ant-Design-Vue 修改 Popover 和 Tooltip 样式

广告位招租 (vx: ghostcode, 备注:网站广告)

默认情况下这两个组件的弹出框会被添加到 body 下面,有时候利用父级的选择器来更改样式是不行的。两个解决方法:

添加到父级元素内

默认是添加到 body 下,自己可以更改,下面的代码就是组件放到哪里就添加到哪里:

:getPopupContainer="(triggerNode) => triggerNode.parentNode"

当然也可以指定到别的地方。

利用 overlayClassName 和 overlayStyle

这里的有个注意点是 Popover 的参数里是没有列出这两个配置选项,Tooltip 则列出了: