我的 React js 代码如何与现有的 Obj-C 逻辑交互？

Question

我现有的 Obj-C 项目具有丰富的业务逻辑。我想尝试在特定屏幕上使用 React Native（我的意思是 Cocoa 中的视图控制器），但我在 repo 中看到的每个示例都包含 javascript 中的逻辑。我如何将 React Native 视为渲染，但将用户操作传递给我的 Objective-C 代码？

编辑 2015 年 3 月 31 日：

原生视图模块似乎不是一个好的解决方案，因为原生模块是从 React 代码中实例化的。因此，如果我想为该视图控制器使用已经创建的视图模型，我需要有一些单例，这就像是一些共享状态。我认为这很糟糕。

Answer 1

查看文档：

http://facebook.github.io/react-native/docs/nativemodulesios.html#content

React Native 提供 "Native Modules" 作为 Obj-C 和 JavaScript 之间的桥梁。在 React Native 主页上还有更多关于此的信息：

http://facebook.github.io/react-native/

在 "Extensibility" 标题下，它展示了如何公开自定义 iOS 视图。

Answer 2

React 视图不可能不通过 JavaScript 直接调用本机方法，除非您为屏幕上的所有内容创建自定义本机视图插件。

您最好的选择可能是创建一个自定义本机模块来导出您要调用的所有本机方法，然后编写一个最小的 React JavaScript 应用程序，它除了将视图中的触摸事件转发到您的应用程序之外什么都不做通过调用这些方法来模块。

如果您需要与 JS 应用程序通信，您的模块可以使用传递给导出方法的回调，或广播 JS 代码可以观察到的事件。

不过，为了充分利用 React Native，我建议您尝试将所有视图和控制器逻辑保留在 JS 部分，并且只从原生端公开业务逻辑。否则，您将失去快速重新加载以测试更改等的所有好处。

Answer 3

我有同样的问题以及我是如何解决的：

围绕 NSNotificationCenter 创建本机模块包装器，因此 javascript 代码可以发布 iOS 事件。
在 React-Native 代码周围的 ReactController-wrapper 中订阅该事件。
当用户单击按钮时引发事件（当我们需要将控制权交还给 objective-c 时）并将所需数据作为字典传递。
从 ReactController-wrapper (objective-c) 捕获事件，处理数据，打开其他 controllers/etc。

Answer 4

如果您在视图控制器中实现了 RCTRootView，您可以使用它来访问 RTCBridge，然后从此获得对您的模块的访问权限。

这将允许您在模块中保留对视图控制器的引用，使您能够直接传递对方法的调用，而不是依赖 NSNotifications。

示例：

在你的视图控制器中

    let reactView = RCTRootView(bundleURL: jsCodeLocation, moduleName: "MyReactApp", initialProperties: nil, launchOptions: nil)
    self.reactBridge = reactView.bridge
    let myModule = self.reactBridge.module(for: MYModuleClass.self) as! MYModuleClass
    myModule.viewController = self

并在您的模块中保留引用：

   @objc(MYModuleClass)
   class MYModuleClass: NSObject {

      weak var viewController: MyViewController!

   }

我的 React js 代码如何与现有的 Obj-C 逻辑交互？

How my react js code can interact with existing Obj-C logic?

react-native