时间戳

首页 > 解决方案 > 链接多个上下文提供程序在反应本机中工作在同一领域

react-native - 链接多个上下文提供程序在反应本机中工作在同一领域

问题描述

我正在尝试链接多个 ContextProviders 按不同目的划分，以便在本机反应的同一领域上工作。

<FirstRealmProvider>
   <SecondRealmProvider>
     <FunctionalComonentUsingHooksFromFristAndSecond>
   </SecondRealmProvider> 
</FirstRealmProvider>

我正在初始化（打开）第一个组件中的领域（它还负责关闭等），并在realmRef = useRef<Realm>(null);useEffect 挂钩的帮助下将 ref 保存到它。使用从第二个和第三个组件中的第一个组件导出的上下文函数和集合可以正常工作，除非我在 SecondRealmProvider 中实现另一个 useEffect （有或没有直接访问领域或其导出的引用）。如果我这样做，该领域抱怨realmRef.current为空（在 FirstRealmProvider 的useEffect中设置，并且不应为空，除非在首先调用 SecondRealmProvider 的内部 useEffect 之后调用useEffect。在这种情况下，它似乎不可能链接并通过关注点分享逻辑FirstRealmProvider将成为一个多用途的杂乱组件。

请帮我查明我在这里缺少什么。

谢谢。

标签： react-nativerealmuse-effectreact-context

解决方案

由于反应首先在内部组件上进行初始化（调用 useEffect），因此如果这也依赖于初始化，则这些组件无法使用外部组件的功能。为了让它正常工作，我添加了一个 is"Particular"ProviderInitialized ，如下所示：

const [nlpIsInitialized, setInitialized] = useState<boolean>(false);

并且每个提供者都会忽略 useEffect，直到外部提供者报告也被初始化。useEffect 还取决于外部 Provider 的初始化值，现在一切正常。

推荐阅读