解決ant design 中 select的option 隨頁面滾動條滾動的bug

原因：

 

 

Select組件有個API getPopupContainer，Ant Design官方文檔給出的用途解釋為：“菜單渲染父節點。默認渲染到 body 上，如果你遇到菜單滾動定位問題，試試修改為滾動的區域，並相對其定位”。同時官網也強調一個特殊情況需要注意：“如果發現下拉菜單跟隨頁面滾動，或者需要在其他彈層中觸發 Select，請嘗試使用 getPopupContainer={triggerNode => triggerNode.parentNode} 將下拉彈層渲染節點固定在觸發器的父元素中”。

解決方案：

在Select組件中添加“getPopupContainer={triggerNode => triggerNode.parentNode}” 使其固定在父元素中；

如果是日期DatePicker組件 使用 “getCalendarContainer={triggerNode => triggerNode.parentNode}”

　　　　<Select
          getPopupContainer={triggerNode => triggerNode.parentNode}
          defaultValue=''
          notFoundContent="請選擇"
          placeholder="請選擇"
          value={this.state.nextAction}
          onChange={(value) => this.changeSubmitOption(value)}
        >