javascript - 定位/滚动到不是紧密父/子的 React 组件

Question

我遇到了一种情况，我想从另一个不处于直接或密切父/子关系的组件滚动到 React 组件。

结构可以解释如下:

Component A > a parent > a parent > a parent > a parent > a parent > a parent > a child > a child > Component B

如您所见，它根本不是直接的。如果关系是直接的，甚至是祖 parent /孙子女，我通常会通过一名裁判。然而在这种情况下，我需要将 ref 传递给 10 个左右的文件才能访问它，这看起来很荒谬。

我知道我可以使用 document.getElementById (或类似的)，但想知道是否有办法通过 ref 或 React 中类似的东西来做到这一点？

Answer 1

您可以尝试React Context 。将 Context Provider 放在组件 A 中，将 Context Consumer 放在组件 B 中。B 可以通过 Context 将其引用传递给 A，反之亦然