vue2.0 antdesign时间框和下拉框跟随页面滚动问题

在使用a-date-picker组件的过程中,发现如图问题,a-select也会有这个问题,但是添加上如下代码就迎刃而解了。

 :getPopupContainer="triggerNode=> triggerNode.parentNode

vue2.0 antdesign时间框和下拉框跟随页面滚动问题_第1张图片

a-date-picker解决方案如下:

也是为a-date-picker添加如下代码:

:get-calendar-container="triggerNode => triggerNode.parentNode"

不同的是,添加上面代码后,组件会网上移动,分别打印出triggerNode和 triggerNode.parentNode也没发现问题,因为获取的都是对的,还想到添加refs去解决,发现他的定位并不起作用
于是根据打印出的dom,得出终极解决方案如下:

#periodEndDate .ant-calendar-picker-container{
  position: absolute;
  top: 0 !important;
  left: 0 !important;
}
#periodStartDate .ant-calendar-picker-container{
  position: absolute;
  top: 0 !important;
  left: 0 !important;
}

问题得到解决!

你可能感兴趣的:(Vue,antd,vue.js,前端)