react中调用antd的Select下拉框位置随页面滚动

页面滚动后 下拉框也会跟着滚动

点开样式：

页面滚动后

原代码：

<Select
  mode="multiple"
  showSearch
  optionFilterProp="children"
  style={{ width: 600 }}
  placeholder="请选择"
>
  {this.state.zhikongList.map((item: any, index: any) => {
      return <Option value={item.id}>{item.scoreName}</Option>
  })}
</Select>

解决办法为:

getPopupContainer={triggerNode => (triggerNode.parentElement || document.body)}

官方文档的解释

改变后代码：

<Select
  getPopupContainer={triggerNode => (triggerNode.parentElement || document.body)}//加入这一行
  mode="multiple"
  showSearch
  optionFilterProp="children"
  style={{ width: 600 }}
  placeholder="请选择卡控质检点"
>
  {this.state.zhikongList.map((item: any, index: any) => {
      return <Option value={item.id}>{item.scoreName}</Option>
  })}
</Select>

解决后

滚动不在将下拉框带偏