如何将导航道具传递给在React Native中动态呈现的子组件？

Question

我有一个简单的应用程序有4页： 介绍 主屏幕 StoreA StoreB

StoreA包含标题和商店列表。商店列表由位于特定区域的所有商店组成。使用Redux，我已经做到了这一点，当用户点击单个商店时，商店的细节变得可见（非常类似于Stephen Grider的techStack教程）。我想将导航道具一直传递到CardSection，其中包含点击时的详细信息。如何从StoreA-＆gt; StoreList-＆gt; IndividualStore-＆gt; StoreDetails传递导航道具，以便我可以创建一个按钮供用户导航回HomeScreen？

Answer 1

你有几个选择， 第一个是将prop：this.props.navigation从屏幕中传递给子组件，该屏幕是该子组件的父节点，如果它嵌套在另一个组件中，则只需继续传播导航支柱。 / p>

另一种选择是在mobx / redux商店中保留导航器导航的参考，如下所示：

<Navigator ref={ref=>saveRefInStore(ref._navigation)} screenProps={/* props if needed */}/>

另一种选择是使用这个库rn-navigation-store来管理导航，包括嵌套导航器和持久性（如果需要）。

使用此库，您可以从所需的每个组件导航。

here is a link to the github repo

当然还有更多选择，但我认为这些选项会对你有所帮助