antd中Select搜索框的下拉列表位置如何自由随心调整而不受屏幕缩放影响

[bigbigDreamer]

antd中Select搜索框的下拉列表位置如何自由随心调整而不受屏幕缩放影响

概述

本来antd中select框的位置是根据输入框自动调整位置，但是为了定制化需求需要左右偏移一下，这时候如果不采取措施，很容易导致绝对定位到某一个维度，缩放屏幕的时候可能会导致绝对固定到某一个点，这就有点得不偿失了。

解决

we can 借助 getPopupContainer = { () => document.fetElementById( idName ) }来约束其绝对定位的父元素。【官方文档这样介绍：菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。】

这下子就好办了，有人可能已经想到了子绝父相，没错，这时候给父元素设置相对定位，这时候随便调整下拉列表的左右间距，再也不用担心屏幕缩放带来的错位问题。

额外思考

但是！！！如果一个组件多处复用，可以嘛？告诉你，不可以，id必须动态改变，每复用一次就变动一次，这样才会保证下拉列表的正常定位与渲染。