React Navigation：重新渲染导致导航 ref.current 为 null

Question

我正在尝试使用 React-navigation 为 React Native 制作一个可重用的 SplitView 组件，其中父导航器能够对其子导航器执行导航。为了实现此目的，我使用 ref 以编程方式在嵌套导航器上执行导航。但是，我遇到了一个问题，当我的应用程序重新呈现时，我的所有导航引用都会变成：

{ current: null }

我无法执行任何进一步的导航。

这是演示此问题的Snack 项目的链接。请注意，您必须取消第 13-17 行的注释App.js才能看到该问题。注释掉的 useEffect 用于强制初始重新渲染。没有它，导航就可以正常工作。

“在没有导航道具的情况下导航”的文档有一些关于此用例的初始化问题的注释，但我对他们建议的解决方案没有任何运气。我认为他们提到的问题是导航容器有机会安装之前的竞争条件 - 我不认为这就是发生在我身上的事情，因为似乎一旦我的应用程序重新渲染，我就永远无法访问正确的参考号。

Answer 1

事实证明，问题是因为我使用的createRef是而不是useRef. 使用 refs + 函数组件时，必须使用钩子useRef，因为createRef每次渲染都会返回一个新的 ref，并且不可能像在类组件中那样将创建的 ref 存储为实例变量。