相对于背景中的元素定位react-modal

Question

我的主App元素（id =“inputBox”）中有一个输入框，当一个输入被赋予此输入框时（通过onChange事件）弹出一个react-modal。

我希望将反应模式放在此输入框的正下方，当它弹出打开但无法执行此操作时。

到目前为止，我只能通过计算输入框的偏移量并相应地设置模态叠加层的style.top/style.left来相对于视口定位它。 但是这会导致一些其他问题，所以我需要能够设置相对于输入框的位置。

有关如何执行此操作的任何建议都将受到高度赞赏。

Answer 1

我认为您正在创建类似搜索下拉列表的内容，其中某些结果会显示在用户搜索查询中。我能想到的最简单的解决方案是创建一个新的组件并在其中包含弹出窗口，这样无论如何都会相对于它。

您的组件需要有自己的状态