getPopupContainer解决ant-design-vue select组件下拉框偏移错位

解决下拉框偏移和table中下拉框失去焦点问题

  <Select
      allowClear
      class="book-select"
      @change="value=>handleSelectChange('publish',value)"
      placeholder="出版社"
      :getPopupContainer="
          triggerNode => {
            return triggerNode.parentNode || document.body;
          }
        "
    >
      <SelectOption
        v-for="(publishItem,index) in publishes"
        :value="publishItem.code"
        :key="index"
      >{{publishItem.name}}</SelectOption>
    </Select>

如何使下拉框跟随select移动

import { Select } from 'antd';

// 自定义函数用于返回 Select 组件的父容器元素
const getPopupContainer = triggerNode => {
  return triggerNode.parentNode;
};

// 在 Select 组件上设置 getPopupContainer 属性
<Select getPopupContainer={getPopupContainer}>
  {/* 下拉选项 */}
</Select>

滚动页面时，下拉框会跟随Select组件移动而不是固定在原始位置上。注意确保函数getPopupContainer返回的是Select组件的父容器元素。