反应导航结构

Question

嗨反应开发者我有一个反应导航结构的问题，当我们嵌套导航器时会发生这种情况，在反应导航的文档中说最好减少嵌套导航器的数量，所以我想展示一个例子需要在所有导航路径中呈现 One 产品屏幕的电子商务应用程序。

"tab navigator 的初始路由是第一个 stack navigator，它有初始路由主屏幕"

正如您在此图中看到的那样，标签抽屉和堆栈导航器组合在一起，我认为这是最低效的方法，我认为是因为我们正在为标签导航器创建两个堆栈导航器和在这个堆栈中，我们正在复制一个产品屏幕。

“我们需要在主屏幕和产品部分推送一个产品屏幕，这就是我们将产品屏幕放在堆栈导航器中的原因，否则会抛出错误”

现在，可以做 react memoize 或纯组件，但我们仍然在创建两个堆栈导航器。现在，这是我在一些博客中看到的人们进行这种导航的方式，但我认为有更好的方式来做到这一点。

这是我认为最有效的方式，我们删除选项卡的堆栈导航器并只放置要渲染的屏幕，并在抽屉中添加一个堆栈导航器，其中包含我们需要推送的屏幕。

现在我的问题是，是否可以在主屏幕上推送一个产品屏幕，是否也需要在搜索屏幕上？以及制作这样的东西的最佳结构是什么“这样的东西我的意思是在所有屏幕中使用一个产品屏幕来推送和展示给用户”，并且没有性能问题通过放置大量嵌套导航器，我想避免不必要地重新渲染屏幕和组件？

第一种好还是第二种好？

Answer 1

在我看来，案例 2 更好，因为您没有不必要地复制屏幕。

在考虑要定义的 React Navigation 结构之前，绘制应用程序的表面级页面以获取整个应用程序的导航系统的全局视图会很有用。

例如：

这张地图立即为许多可能的可用性弱点的根源提供了宝贵的洞察力。

此外，它还明确了屏幕之间的所有关系以及它们之间可能的用户流（您必须从哪个屏幕导航/到哪个屏幕）。

之后，考虑到屏幕的独特性，可以提出 React Navigation Structure。这样，在嵌套的堆栈/抽屉/选项卡之间导航就变成了一种简单的编码工作，而不是架构工作。