根据下一个屏幕数据反应基于本机逻辑的导航

Question

我有一个 React Native 应用程序，在入职工作流程（登录后）期间，我几乎没有屏幕可以显示或跳过，具体取决于从后端检索的数据（存储在本地数据库中）。

例如，我有一个屏幕显示用户接受的法律文件，但是如果用户在新设备上重新安装应用程序，当他进行身份验证时，将从后端检索法律文件的同意状态，并且该屏幕可能是跳过...

我的问题是确定在哪里编写与导航相关的逻辑。

典型的工作流程是：

登录=>加载屏幕（直到我们下载了法律文档）=>法律文档（可选，如所解释的）=>其他入门屏幕=>再次加载屏幕（如果仍在从后端检索数据）。

我应该在哪里写

navigation.navigate('LegalDocuments')

行代码。

• 如果我在加载屏幕中写入它，我将获取文件（以便确定下一个屏幕），然后在法律文件屏幕中，我将再次获取这些文件。
• 如果我在导航器中获取它们，也会出现同样的问题。
• 如果我在法律文档屏幕的 useFocusEffect 中获取它们，用户将短暂地看到屏幕转换。

我应该如何/在哪里实现这个导航逻辑？

Answer 1

您本身不需要加载屏幕，只需一个简单的加载组件（如果需要，可以全屏）。

因此，您可以在 useFetchLegalDocuments 等挂钩中获取文档，然后从登录导航到 LegalDocuments 屏幕，但在获取完成之前，您将显示加载情况。

const LegalDocumentsContainer = () => {
  const { isLoading, legalDocuments } = useFetchLegalDocuments();

  if (isLoading) {
    return <Loading />
  }

  return <LegalDocuments documents={legalDocuments} />
}

当用户到达此屏幕时，他们将看到一个加载指示器，但是一旦获取完成，组件就会呈现法律文档。

请记住，这是非常高的水平，我将部分逻辑移至挂钩中，以便我可以专注于问题。