javascript - 从 swift 或 objective-c 向 js 发送事件

Question

我创建了以下类(精简版)，这是对完整文件的引用 https://github.com/cotyembry/CastRemoteNative/blob/7e74dbc56f037cc61241f6ece24a94d8c52abb32/root/ios/CastRemoteNative/NativeMethods.swift

@objc(NativeMethods)
class NativeMethods: RCTEventEmitter {
  @objc(sendEventToJSFromJS)
  func sendEventToJSFromJS {
    self.emitEvent(eventName: "test", body: "bodyTestString")
  }
  func emitEvent(eventName: String: body: Any) {
    self.sendEvent(withName: eventName, body: body)
  }
}

当我像下面这样调用 emitEvent 方法时，它完美地工作并触发了我的 javascript 代码中的回调监听器，它是从 https://github.com/cotyembry/CastRemoteNative/blob/7e74dbc56f037cc61241f6ece24a94d8c52abb32/root/js/Components/ChromecastDevicesModal.js

从 JavaScript 方面

import {
  NativeModules,
  NativeEventEmitter
} from 'react-native'

//here I bring in the swift class to use inside javascript
var NativeMethods = NativeModules.NativeMethods;

//create an event emitter to use to listen for the native events when they occur
this.eventEmitter = new NativeEventEmitter(NativeMethods);
//listen for the event once it sends
this.subscription = this.eventEmitter.addListener('test', (body) => { console.log('in test event listener callback', body)});

NativeMethods.sendEventToJSFromJS() //call the native method written in swift

我只是在 javascript 中按下按钮时调用了 sendEventToJSFromJS 方法

同样，这有效并且 console.log('in test event listener callback', body) 代码有效并在 javascript 端运行

我的问题是这不起作用:

如果我在定义类后在 swift 文件中执行以下操作，这将不起作用:

var nativeMethodsInstance = nativeMethods()
nativeMethodsInstance.sendEventToJSFromSwift()

为什么？因为抛出如下错误:

Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'bridge is not set. This is probably because you've explicitly synthesized the bridge in NativeMethods, even though it's inherited from RCTEventEmitter.'

那么，在创建 NativeMethods 的 instance 时，与不创建 ... 有什么区别？

更多信息:

当我在 .h 和 .m 文件而不是 .swift 文件中编写这些相同的代码片段时，Objective-C 会遇到相同的桥未设置问题

我在 native 代码中找到了错误消息的打印位置，但它只有变量

_bridge

并且正在检查它是否为 nil

此错误来自的文件是:

RCTEventEmitter.h
RCTEventEmitter.c

这是 RCTEventEmitter.c 的完整片段

- (void)sendEventWithName:(NSString *)eventName body:(id)body
{


  RCTAssert(_bridge != nil, @"bridge is not set. This is probably because you've "
        "explicitly synthesized the bridge in %@, even though it's inherited "
        "from RCTEventEmitter.", [self class]);

  if (RCT_DEBUG && ![[self supportedEvents] containsObject:eventName]) {
    RCTLogError(@"`%@` is not a supported event type for %@. Supported events are: `%@`",
                eventName, [self class], [[self supportedEvents] componentsJoinedByString:@"`, `"]);
  }
  if (_listenerCount > 0) {
    [_bridge enqueueJSCall:@"RCTDeviceEventEmitter"
                    method:@"emit"
                      args:body ? @[eventName, body] : @[eventName]
                completion:NULL];
  } else {
    RCTLogWarn(@"Sending `%@` with no listeners registered.", eventName);
  }
}

这个 _bridge 值在哪里设置以及如何设置，这样我就可以知道，在它失败的情况下如何设置它

我在 RCTEventEmitter.h 中也发现了以下内容

@property (nonatomic, weak) RCTBridge *bridge;

在给出的错误中提到桥是在 RCTEventEmitter 中继承的，所以这可能是 bridge 属性的 weak 部分的问题？

或者我是否需要改变我一起做这件事的策略？

我知道这可能与我没有完全理解

@synthesize bridge = _bridge;

部分代码和混合的所有语言都没有多大帮助，哈哈...

这真的很难，所以任何帮助将不胜感激!非常感谢您的宝贵时间

当项目历史代码代表我上面问题中的代码时，这里是完整项目的链接(因为我已经对项目进行了更改):

https://github.com/cotyembry/CastRemoteNative/tree/7e74dbc56f037cc61241f6ece24a94d8c52abb32

Answer 1

我想通了

警告:此解决方案使用已弃用的方法 react native 方法 - 我无法弄清楚如何“正确地”继承 RCTEventEmitter 并发送事件...每次我尝试 _bridge 都会以 nil

结束

确保 Swift 桥接到 Objective C(如果您使用 swift 将事件发送到 javascript)

不要创建导出的 native 模块的实例(无论它们是用 Swift 还是 Objective C 编写的)

让 React Native 的底层实现执行此操作，对于每个需要发送事件的类，将特定的 Native 类 Objective C 实现代码或 Swift 代码(Native 模块)导出到 React-Native。这允许 javascript 能够监听事件

var publicBridgeHelperInstance = PublicBridgeHelper()  //instantiate the  the objective c class from inside the .swift file to use later when needing to get a reference to the bridge to send an event to javascript written in react native

@objc(DeviceManager)             //export swift module to objective c
class DeviceManager: NSObject {

  @objc(deviceDidComeOnline:)    //expose the function to objective c
  public func deviceDidComeOnline(_ device: GCKDevice) {
    //imagine this deviceDidComeOnline function gets called from something from the Native code (totally independent of javascript) - honestly this could be called from a native button click as well just to test it works...

    //emit an event to a javascript function that is a in react native Component listening for the event like so:

    //1. get a reference to the bridge to send an event through from Native to Javascript in React Native (here is where my custom code comes in to get this to actually work)
    let rnBridge = publicBridgeHelperInstance.getBridge()  //this gets the bridge that is stored in the AppDelegate.m file that was set from the `rootView.bridge` variable (more on this later)

    //(if you want to print the bridge here to make sure it is not `nil` go ahead:
    print("rnBridge = \(rnBridge)")

    //2. actually send the event through the eventDispatcher
    rnBridge?.eventDispatcher().sendAppEvent(withName: "test", body: "testBody data!!!")
  }
}

在 AppDelegate.h 中放置(除了文件中已有的代码)

#import "YourProjectsBridgingHeaderToMakeThisCodeAvailableInSwift.h"  //replace this with your actual header you created when creating a swift file (google it if you dont know how to bridge swift to objective c)

@interface PublicBridgeHelper: NSObject
  -(RCTBridge*)getBridge;
@end

在 AppDelegate.m 中放入(除了文件中已有的代码)

#import <React/RCTRootView.h>

RCTBridge *rnBridgeFromRootView;

@implementation PublicBridgeHelper    //this is created to SIMPLY return rnBridgeFromRootView defined above over to my Swift class when actually sending the event to javascript that defines a react native Component
-(RCTBridge*)getBridge {
  NSLog(@"rnBridgeFromRootView = @%@", rnBridgeFromRootView);
  return rnBridgeFromRootView;
}

重要 - 还要确保将以下代码行添加到 Objective C .h 的桥接 header 中，以使此 PublicBridgeHelper 定义可用于 .swift代码

#import "AppDelegate.h"

最后，

现在向您展示如何设置 AppDelegate.m 中使用的 rnBridgeFromRootView 变量(在将事件发送到 javascript 之前返回并在 .swift 代码中使用)

打开AppDelegate.m，在方法体中

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { ... }

在实例化 rootView 变量的代码行之后包含以下内容

即在可能看起来像的行之后

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"YourProjecNameProbably" initialProperties:nil launchOptions:launchOptions];

添加:

rnBridgeFromRootView = rootView.bridge  //set the bridge to  be exposed and returned later and used by the swift class

现在解释 .swift 文件中的 publicBridgeHelperInstance.getBridge() 部分

publicBridgeHelper 是一个 objective c 类的实例，它允许 swift 类能够获得对 react native bridge 的引用

如果您在阅读本文后仍然无法理解我的回答，我制作了一个视频，您可以在这里观看:

https://www.youtube.com/watch?v=GZj-Vm9cQIg&t=9s