Javascript React Hooks中的自动下拉菜单

如果我的组件位于可滚动元素（如

FormModal

）中，我会遇到问题。如果我的组件在一个可滚动的元素中，我希望它按元素而不是按常规容器拖放。我怎样才能解决这个问题<代码>文档。滚动元素不起作用

export const useToggleDropup = () => {
  const refDropdown = useRef<HTMLElement>(null);
  const [isDropup, setIsDropup] = useState(false);

  useEffect(() => {
      const bounding = refDropdown?.current?.getBoundingClientRect();
      if(bounding && bounding.bottom > (window.innerHeight || document.documentElement.clientHeight)) {
        setIsDropup(true)
      }
  }, [refDropdown])
 
    return { isDropup, refDropdown };
};

export const useToggleDropup=（）=>{
const refDropdown=useRef（null）；
const[isDropup，setIsDropup]=useState（false）；
useffect（（）=>{
const bounding=refDropdown？.current？.getBoundingClientRect（）；
if（bounding&&bounding.bottom>（window.innerHeight | | document.documentElement.clientHeight））{
setIsDropup（真）
}
}，[Ref下拉列表]）
返回{isDropup，refDropdown}；
};