给popover添加overlayClassName属性
<a-popover
overlay-class-name="screen-gantt-popover"
<!-- 这里可以是overlayClassName 作者由于eslint的原因 提示要hyphenated(带有连字符号的) -->
>
然后再style里面就可以正常写样式 诶就是不写,就是玩儿! (主要是我不知道你要的是哪个方向的,所以还是去浏览器定位copy)
.screen-gantt-popover > .ant-popover-content > .ant-popover-inner {
min-width: 277px !important;
box-shadow: 0px 1px 6px 0px rgba(149,198,255,0.59) !important;
}
.ant-popover-placement-bottom > .ant-popover-content > .ant-popover-arrow {
background: rgba(18, 26, 39,0.8) !important;
border-top-color: rgba(18, 26, 39,0.8) !important;
border-left-color: rgba(18, 26, 39,0.8) !important;
box-shadow: -3px -3px 6px rgba(149,198,255,0.59) !important;
border-right-color: transparent !important;
border-bottom-color: transparent !important;
}
.ant-popover-placement-top > .ant-popover-content > .ant-popover-arrow {
background: rgba(18, 26, 39,0.8) !important;
border-bottom-color: rgba(18, 26, 39,0.8) !important;
border-right-color: rgba(18, 26, 39,0.8) !important;
box-shadow: 3px 3px 6px rgba(149,198,255,0.59) !important;
border-left-color: transparent !important;
border-top-color: transparent !important;
}
缺点
该方法要去掉 scoped 如果会影响到你其他页面慎重考虑