您如何将新路由推送到 Navigator 以从外部代码做出本机反应？答案

【问题标题】：How do you push a new route onto a Navigator in react native from external code?您如何将新路由推送到 Navigator 以从外部代码做出本机反应？
【发布时间】：2015-10-16 22:41:18
【问题描述】：

在renderScene 函数中很容易获得对navigator 的引用，因此在响应JSX 树中发生的事件时调用navigator.push(newRoute) 很简单。

不过，就我而言，我想从外部事件调用navigator.push(newRoute)。我的应用使用 Google 登录用户并在登录完成时触发一个事件，在这种情况下我想导航到新路线。

如何获得对导航器的引用？除了作为renderScene的参数之外，还有什么方法可以得到它？

【问题讨论】：

标签： react-native

【解决方案1】：

您可以通过 refs 属性获取导航器：https://facebook.github.io/react/docs/more-about-refs.html。它是反应的一部分（不特定于反应原生）。从 react-native 文档中并不明显看出有许多“react”特性可用于 react-native，所以我真的建议仔细研究一下 react-native。

但是请注意，Facebook 没有明确而大声地提及 refs 是有充分理由的。 Refs 实际上不是访问组件的“首选”方式。您的情况当然可能有所不同，但 Google 注册实际上可能不是“外部的”。它实际上可能是导航器上方层次结构树中组件之一的一部分（在这种情况下，您可以将状态更改向下传递）。

引用上面“关于 refs 的更多信息”文档的摘要：

如果您还没有使用 React 编写过多个应用程序，那么您的第一个通常倾向于尝试使用 refs 来“做事” 发生”在您的应用程序中。如果是这种情况，请花点时间思考更多关键在于组件中的状态应该在哪里拥有等级制度。通常，很明显“拥有”它的适当位置状态在层次结构中处于较高级别。将状态放在那里通常会消除任何使用 refs 来“让事情发生”的愿望—— 相反，数据流通常会实现您的目标。

再一次 - 你的情况可能不同，使用 refs 可能是完全合理的，但如果你想（例如）将所有与 Google 相关的东西分离到单独的对象，并且如果这使得注册“外部” - 三思而后行。 React 确实鼓励将所有与“组件”逻辑相关的东西放在一个地方（组件）——即使其中包括各种技术和外部 API。

【讨论】：

感谢您的出色回答。特别是对于导航器来说，似乎我们没有得到我们需要的工具来保持像谷歌登录这样的内部。理想情况下，我的助焊剂商店会更新为signedIn: true，然后会注意到navigator.push(newSignedInRoute)。使用我自己定义的组件，我可以使用componentDidMount 将新的侦听器添加到我的商店和其他“外部”事物中。使用导航器，我似乎获得自然参考的唯一地方是renderScene。您是否建议在 renderScene 中添加/删除更改处理程序？
为了稍微澄清一下我的情况，我有一个 GoogleSigninButton，当点击它时，会调用一些本机目标 c 代码来执行一些 GoogleSigninShenanigans。来自目标 c 的响应通过事件返回给 JS。我想我可以让 GoogleSigninButton（它可能有 navigator 的自然上下文）监听该事件并调用回调，该回调又导航到新路线......但我还是宁愿让商店发出 @ 987654329@ 事件并进行导航以响应该事件。
我同意发出事件并拥有商店是很好的反应模式。我在类似使用 Navigator 时有点挣扎。一种可能有效的方法是在内部做一些组合+使用 ref 类似于接受的答案：stackoverflow.com/questions/25720595/…。外部组件可以是componentDidMount，在内部它使用 ref 来获取 Navigator 的引用。它有点泄漏，因为 ref 可以在外面使用，但是组件可以有额外的逻辑（签名）并且可以独立使用。
完美，这就是我决定的。再次感谢 Jarek