iOS 原生模块

信息

原生模块和原生组件是我们传统架构使用的稳定技术。当新架构稳定后，它们将在未来被弃用。新架构使用 Turbo 原生模块 和 Fabric 原生组件 来实现类似的结果。

欢迎来到 iOS 的原生模块。请先阅读 原生模块简介，了解原生模块是什么。

创建日历原生模块

在本指南中，您将创建一个名为 CalendarModule 的原生模块，它允许您从 JavaScript 访问 Apple 的日历 API。最终，您将能够从 JavaScript 调用 CalendarModule.createCalendarEvent('Dinner Party', 'My House');，从而调用创建日历事件的原生方法。

设置

首先，在 Xcode 中打开 React Native 应用程序中的 iOS 项目。您可以在 React Native 应用程序中的此处找到您的 iOS 项目

您可以在哪里找到 iOS 项目的图片

我们建议使用 Xcode 编写原生代码。Xcode 专为 iOS 开发而构建，使用它可以帮助您快速解决较小的错误，例如代码语法错误。

创建自定义原生模块文件

第一步是创建我们的主要自定义原生模块头文件和实现文件。创建一个名为 RCTCalendarModule.h 的新文件

在与 AppDelegate 相同的文件夹中创建自定义原生模块文件的图片

并向其中添加以下内容

//  RCTCalendarModule.h
#import <React/RCTBridgeModule.h>
@interface RCTCalendarModule : NSObject <RCTBridgeModule>
@end

您可以使用任何适合您正在构建的原生模块的名称。将类命名为 RCTCalendarModule，因为您正在创建日历原生模块。由于 ObjC 没有像 Java 或 C++ 那样在语言级别上支持命名空间，因此约定是在类名前添加一个子字符串。这可能是您应用程序名称或基础设施名称的缩写。在本例中，RCT 指的是 React。

如下所示，CalendarModule 类实现了 RCTBridgeModule 协议。原生模块是一个实现了 RCTBridgeModule 协议的 Objective-C 类。

接下来，让我们开始实现原生模块。使用 Xcode 中的 cocoa touch 类在同一个文件夹中创建相应的实现文件 RCTCalendarModule.m，并包含以下内容

// RCTCalendarModule.m
#import "RCTCalendarModule.h"

@implementation RCTCalendarModule

// To export a module named RCTCalendarModule
RCT_EXPORT_MODULE();

@end

模块名称

目前，您的 RCTCalendarModule.m 原生模块仅包含 RCT_EXPORT_MODULE 宏，该宏将原生模块类导出并注册到 React Native。RCT_EXPORT_MODULE 宏还带有一个可选参数，用于指定模块在 JavaScript 代码中可访问的名称。

此参数不是字符串文字。在下面的示例中，传递了 RCT_EXPORT_MODULE(CalendarModuleFoo)，而不是 RCT_EXPORT_MODULE("CalendarModuleFoo")。

// To export a module named CalendarModuleFoo
RCT_EXPORT_MODULE(CalendarModuleFoo);

然后可以在 JS 中像这样访问原生模块

const {CalendarModuleFoo} = ReactNative.NativeModules;

如果未指定名称，则 JavaScript 模块名称将与 Objective-C 类名称匹配，并删除任何“RCT”或“RK”前缀。

让我们遵循下面的示例，并调用不带任何参数的 RCT_EXPORT_MODULE。因此，该模块将使用名称 CalendarModule 公开给 React Native，因为这是 Objective-C 类名称，已删除了 RCT。

// Without passing in a name this will export the native module name as the Objective-C class name with “RCT” removed
RCT_EXPORT_MODULE();

然后可以在 JS 中像这样访问原生模块

const {CalendarModule} = ReactNative.NativeModules;

将原生方法导出到 JavaScript

除非明确告知，否则 React Native 不会将原生模块中的任何方法公开给 JavaScript。这可以通过使用 RCT_EXPORT_METHOD 宏来完成。在 RCT_EXPORT_METHOD 宏中编写的 method 是异步的，因此返回类型始终为 void。为了将 RCT_EXPORT_METHOD 方法的结果传递给 JavaScript，您可以使用回调或发出事件（如下所述）。让我们继续使用 RCT_EXPORT_METHOD 宏为我们的 CalendarModule 原生模块设置一个原生方法。将其命名为 createCalendarEvent()，并暂时使其接收名称和位置参数作为字符串。参数类型选项将在稍后介绍。

RCT_EXPORT_METHOD(createCalendarEvent:(NSString *)name location:(NSString *)location)
{
}

请注意，除非您的方法依赖于 RCT 参数转换（请参阅下面的参数类型），否则 RCT_EXPORT_METHOD 宏在 TurboModules 中将不是必需的。最终，React Native 将删除 RCT_EXPORT_MACRO，因此我们不鼓励人们使用 RCTConvert。相反，您可以在方法体中进行参数转换。

在构建 createCalendarEvent() 方法的功能之前，请在方法中添加一个控制台日志，以便您可以确认它已从 React Native 应用程序中的 JavaScript 调用。使用 React 中的 RCTLog API。让我们在文件顶部导入该头文件，然后添加日志调用。

#import <React/RCTLog.h>
RCT_EXPORT_METHOD(createCalendarEvent:(NSString *)name location:(NSString *)location)
{
 RCTLogInfo(@"Pretending to create an event %@ at %@", name, location);
}

同步方法

您可以使用 RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD 创建同步原生方法。

RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD(getName)
{
return [[UIDevice currentDevice] name];
}

此方法的返回类型必须为对象类型 (id)，并且应可序列化为 JSON。这意味着钩子只能返回 nil 或 JSON 值（例如 NSNumber、NSString、NSArray、NSDictionary）。

目前，我们不建议使用同步方法，因为同步调用方法可能会带来严重的性能损失，并向您的原生模块引入与线程相关的错误。此外，请注意，如果您选择使用 RCT_EXPORT_BLOCKING_SYNCHRONOUS_METHOD，则您的应用程序将无法再使用 Google Chrome 调试器。这是因为同步方法需要 JS VM 与应用程序共享内存。对于 Google Chrome 调试器，React Native 在 Google Chrome 中的 JS VM 内部运行，并通过 WebSockets 与移动设备异步通信。

测试您构建的内容

此时，您已在 iOS 中为原生模块设置了基本脚手架。通过访问原生模块并在 JavaScript 中调用其导出的方法来测试它。

在您的应用程序中找到您想要添加对原生模块的 createCalendarEvent() 方法的调用的位置。下面是您可以添加到应用程序中的组件 NewModuleButton 的示例。您可以在 NewModuleButton 的 onPress() 函数内调用原生模块。

import React from 'react';
import {Button} from 'react-native';

const NewModuleButton = () => {
  const onPress = () => {
    console.log('We will invoke the native module here!');
  };

  return (
    <Button
      title="Click to invoke your native module!"
      color="#841584"
      onPress={onPress}
    />
  );
};

export default NewModuleButton;

为了从 JavaScript 访问您的原生模块，您需要先从 React Native 导入 NativeModules

import {NativeModules} from 'react-native';

然后，您可以从 NativeModules 访问 CalendarModule 原生模块。

const {CalendarModule} = NativeModules;

现在您已可以使用 CalendarModule 原生模块，您可以调用您的原生方法 createCalendarEvent()。下面将其添加到 NewModuleButton 中的 onPress() 方法中

const onPress = () => {
  CalendarModule.createCalendarEvent('testName', 'testLocation');
};

最后一步是重新构建 React Native 应用程序，以便您可以使用最新的原生代码（包含您的新原生模块！）进行访问。在您的命令行中，在 React Native 应用程序所在的位置，运行以下命令

npm

npm run ios

Yarn

yarn ios

迭代时构建

在您完成这些指南并迭代您的原生模块时，您将需要对应用程序进行原生重建，以便从 JavaScript 访问您最近的更改。这是因为您正在编写的代码位于应用程序的原生部分。虽然 React Native 的 metro bundler 可以监视 JavaScript 中的更改并为您动态重建 JS bundle，但它不会对原生代码这样做。因此，如果您想测试您最新的原生更改，则需要使用上述命令进行重建。

回顾✨

您现在应该能够在 JavaScript 中调用原生模块上的 createCalendarEvent() 方法。由于您在函数中使用 RCTLog，因此您可以通过 在您的应用程序中启用调试模式 并查看 Chrome 或移动应用程序调试器 Flipper 中的 JS 控制台来确认您的原生方法是否已调用。您应该在每次调用原生模块方法时看到您的 RCTLogInfo(@"Pretending to create an event %@ at %@", name, location); 消息。

Flipper 中的 iOS 日志图片

此时，您已创建了一个 iOS 原生模块，并在 React Native 应用程序中的 JavaScript 中调用了其上的方法。您可以继续阅读以了解更多信息，例如原生模块方法接受的参数类型以及如何在原生模块中设置回调和 Promise。

超越日历原生模块

更好的原生模块导出

像上面那样从 NativeModules 中提取原生模块进行导入有点笨拙。

为了避免您的原生模块的使用者每次访问您的原生模块时都需要执行此操作，您可以为该模块创建一个 JavaScript 包装器。创建一个名为 NativeCalendarModule.js 的新 JavaScript 文件，内容如下所示

/**
* This exposes the native CalendarModule module as a JS module. This has a
* function 'createCalendarEvent' which takes the following parameters:

* 1. String name: A string representing the name of the event
* 2. String location: A string representing the location of the event
*/
import {NativeModules} from 'react-native';
const {CalendarModule} = NativeModules;
export default CalendarModule;

此 JavaScript 文件也成为您添加任何 JavaScript 端功能的好地方。例如，如果您使用 TypeScript 等类型系统，则可以在这里为您的原生模块添加类型注释。虽然 React Native 尚未支持 Native 到 JS 的类型安全，但使用这些类型注释，您的所有 JS 代码都将是类型安全的。这些注释还将使您更容易切换到将来使用类型安全的原生模块。以下是为日历模块添加类型安全的示例

/**
 * This exposes the native CalendarModule module as a JS module. This has a
 * function 'createCalendarEvent' which takes the following parameters:
 *
 * 1. String name: A string representing the name of the event
 * 2. String location: A string representing the location of the event
 */
import {NativeModules} from 'react-native';
const {CalendarModule} = NativeModules;
interface CalendarInterface {
  createCalendarEvent(name: string, location: string): void;
}
export default CalendarModule as CalendarInterface;

在您的其他 JavaScript 文件中，您可以访问原生模块并像这样调用其方法

import NativeCalendarModule from './NativeCalendarModule';
NativeCalendarModule.createCalendarEvent('foo', 'bar');

请注意，这假设您导入 CalendarModule 的位置与 NativeCalendarModule.js 在同一层级。请根据需要更新相对导入。

参数类型

当在 JavaScript 中调用原生模块方法时，React Native 会将参数从 JS 对象转换为其 Objective-C/Swift 对象的等效项。例如，如果您的 Objective-C 原生模块方法接受一个 NSNumber，那么在 JS 中，您需要使用一个数字来调用该方法。React Native 将为您处理转换。以下是原生模块方法支持的参数类型及其映射到的 JavaScript 等效类型的列表。

Objective-C	JavaScript
NSString	string, ?string
BOOL	boolean
double	number
NSNumber	?number
NSArray	Array, ?Array
NSDictionary	Object, ?Object
RCTResponseSenderBlock	Function (success)
RCTResponseSenderBlock, RCTResponseErrorBlock	Function (failure)
RCTPromiseResolveBlock, RCTPromiseRejectBlock	Promise

以下类型目前受支持，但在 TurboModules 中将不再受支持。请避免使用它们。

• Function (failure) -> RCTResponseErrorBlock
• Number -> NSInteger
• Number -> CGFloat
• Number -> float

对于 iOS，您还可以使用 RCTConvert 类支持的任何参数类型编写原生模块方法（有关支持内容的详细信息，请参阅 RCTConvert）。所有 RCTConvert 辅助函数都接受 JSON 值作为输入，并将其映射到原生 Objective-C 类型或类。

导出常量

原生模块可以通过覆盖原生方法 constantsToExport() 来导出常量。下面覆盖了 constantsToExport()，并返回一个字典，其中包含一个默认事件名称属性，您可以在 JavaScript 中像这样访问它

- (NSDictionary *)constantsToExport
{
 return @{ @"DEFAULT_EVENT_NAME": @"New Event" };
}

然后可以通过在 JS 中像这样对原生模块调用 getConstants() 来访问该常量

const {DEFAULT_EVENT_NAME} = CalendarModule.getConstants();
console.log(DEFAULT_EVENT_NAME);

从技术上讲，可以从 NativeModule 对象直接访问在 constantsToExport() 中导出的常量。这在 TurboModules 中将不再受支持，因此我们鼓励社区切换到上述方法，以避免将来进行必要的迁移。

请注意，常量仅在初始化时导出，因此如果您在运行时更改 constantsToExport() 的值，它不会影响 JavaScript 环境。

对于 iOS，如果您覆盖了 constantsToExport()，那么您还应该实现 + requiresMainQueueSetup 以让 React Native 知道您的模块是否需要在主线程上初始化，在任何 JavaScript 代码执行之前。否则，您将看到一条警告，提示将来您的模块可能会在后台线程上初始化，除非您使用 + requiresMainQueueSetup: 明确选择退出。如果您的模块不需要访问 UIKit，那么您应该以 NO 响应 + requiresMainQueueSetup。

回调

原生模块还支持一种独特的参数类型——回调。回调用于在异步方法中将数据从 Objective-C 传递到 JavaScript。它们还可以用于从原生端异步执行 JS。

对于 iOS，回调使用类型 RCTResponseSenderBlock 实现。下面将回调参数 myCallBack 添加到 createCalendarEventMethod() 中

RCT_EXPORT_METHOD(createCalendarEvent:(NSString *)title
                location:(NSString *)location
                myCallback:(RCTResponseSenderBlock)callback)

然后您可以在您的原生函数中调用回调，提供您想要传递给 JavaScript 的任何结果，并以数组的形式传递。请注意，RCTResponseSenderBlock 只接受一个参数——一个要传递给 JavaScript 回调的参数数组。下面您将回传在早期调用中创建的事件的 ID。

需要强调的是，回调不是在原生函数完成后立即调用的——请记住通信是异步的。

RCT_EXPORT_METHOD(createCalendarEvent:(NSString *)title location:(NSString *)location callback: (RCTResponseSenderBlock)callback)
{
 NSInteger eventId = ...
 callback(@[@(eventId)]);

 RCTLogInfo(@"Pretending to create an event %@ at %@", title, location);
}

然后可以使用以下方法在 JavaScript 中访问此方法

const onSubmit = () => {
  CalendarModule.createCalendarEvent(
    'Party',
    '04-12-2020',
    eventId => {
      console.log(`Created a new event with id ${eventId}`);
    },
  );
};

原生模块应该只调用一次其回调。但是，它可以存储回调并在以后调用它。此模式通常用于包装需要委托的 iOS API——请参阅 RCTAlertManager 以获取示例。如果从未调用回调，则会泄漏一些内存。

有两种方法可以处理回调中的错误。第一种是遵循 Node 的约定，将传递给回调数组的第一个参数视为错误对象。

RCT_EXPORT_METHOD(createCalendarEventCallback:(NSString *)title location:(NSString *)location callback: (RCTResponseSenderBlock)callback)
{
  NSNumber *eventId = [NSNumber numberWithInt:123];
  callback(@[[NSNull null], eventId]);
}

在 JavaScript 中，您可以检查第一个参数以查看是否传递了错误

const onPress = () => {
  CalendarModule.createCalendarEventCallback(
    'testName',
    'testLocation',
    (error, eventId) => {
      if (error) {
        console.error(`Error found! ${error}`);
      }
      console.log(`event id ${eventId} returned`);
    },
  );
};

另一种选择是使用两个单独的回调：onFailure 和 onSuccess。

RCT_EXPORT_METHOD(createCalendarEventCallback:(NSString *)title
                  location:(NSString *)location
                  errorCallback: (RCTResponseSenderBlock)errorCallback
                  successCallback: (RCTResponseSenderBlock)successCallback)
{
  @try {
    NSNumber *eventId = [NSNumber numberWithInt:123];
    successCallback(@[eventId]);
  }

  @catch ( NSException *e ) {
    errorCallback(@[e]);
  }
}

然后在 JavaScript 中，您可以为错误和成功响应添加一个单独的回调

const onPress = () => {
  CalendarModule.createCalendarEventCallback(
    'testName',
    'testLocation',
    error => {
      console.error(`Error found! ${error}`);
    },
    eventId => {
      console.log(`event id ${eventId} returned`);
    },
  );
};

如果要将类似错误的对象传递给 JavaScript，请使用来自 RCTUtils.h. 的 RCTMakeError。目前这只会将一个 Error 形状的字典传递给 JavaScript，但 React Native 旨在将来自动生成真正的 JavaScript Error 对象。您还可以提供一个 RCTResponseErrorBlock 参数，该参数用于错误回调，并接受一个 NSError \* object。请注意，此参数类型在 TurboModules 中将不受支持。

Promise

原生模块还可以实现 Promise，这可以简化您的 JavaScript，尤其是在使用 ES2016 的 async/await 语法时。当原生模块方法的最后一个参数是 RCTPromiseResolveBlock 和 RCTPromiseRejectBlock 时，其对应的 JS 方法将返回一个 JS Promise 对象。

将上述代码重构为使用 Promise 而不是回调，如下所示

RCT_EXPORT_METHOD(createCalendarEvent:(NSString *)title
                 location:(NSString *)location
                 resolver:(RCTPromiseResolveBlock)resolve
                 rejecter:(RCTPromiseRejectBlock)reject)
{
 NSInteger eventId = createCalendarEvent();
 if (eventId) {
    resolve(@(eventId));
  } else {
    reject(@"event_failure", @"no event id returned", nil);
  }
}

此方法的 JavaScript 对应项返回一个 Promise。这意味着您可以在异步函数中使用 await 关键字来调用它并等待其结果

const onSubmit = async () => {
  try {
    const eventId = await CalendarModule.createCalendarEvent(
      'Party',
      'my house',
    );
    console.log(`Created a new event with id ${eventId}`);
  } catch (e) {
    console.error(e);
  }
};

向 JavaScript 发送事件

原生模块可以向 JavaScript 发出信号，而无需直接调用。例如，您可能希望向 JavaScript 发出信号，提醒即将发生来自原生 iOS 日历应用程序的日历事件。首选的方法是子类化 RCTEventEmitter，实现 supportedEvents 并调用 self sendEventWithName

更新您的头文件类以导入 RCTEventEmitter 并子类化 RCTEventEmitter

//  CalendarModule.h

#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>

@interface CalendarModule : RCTEventEmitter <RCTBridgeModule>
@end

JavaScript 代码可以通过在您的模块周围创建一个新的 NativeEventEmitter 实例来订阅这些事件。

如果您在没有监听器的情况下不必要地消耗资源来发出事件，您将收到警告。为了避免这种情况，并优化模块的工作负载（例如，通过取消订阅上游通知或暂停后台任务），您可以在 RCTEventEmitter 子类中覆盖 startObserving 和 stopObserving。

@implementation CalendarModule
{
  bool hasListeners;
}

// Will be called when this module's first listener is added.
-(void)startObserving {
    hasListeners = YES;
    // Set up any upstream listeners or background tasks as necessary
}

// Will be called when this module's last listener is removed, or on dealloc.
-(void)stopObserving {
    hasListeners = NO;
    // Remove upstream listeners, stop unnecessary background tasks
}

- (void)calendarEventReminderReceived:(NSNotification *)notification
{
  NSString *eventName = notification.userInfo[@"name"];
  if (hasListeners) {// Only send events if anyone is listening
    [self sendEventWithName:@"EventReminder" body:@{@"name": eventName}];
  }
}

线程

除非原生模块提供自己的方法队列，否则它不应该对它被调用的线程做出任何假设。目前，如果原生模块不提供方法队列，React Native 将为其创建一个单独的 GCD 队列并在那里调用其方法。请注意，这是一个实现细节，可能会发生变化。如果要为原生模块显式提供方法队列，请覆盖原生模块中的 (dispatch_queue_t) methodQueue 方法。例如，如果它需要使用仅限主线程的 iOS API，则应通过以下方式指定：

- (dispatch_queue_t)methodQueue
{
  return dispatch_get_main_queue();
}

同样，如果某个操作可能需要很长时间才能完成，则原生模块可以指定其自己的队列来在其上运行操作。同样，目前 React Native 将为您的原生模块提供一个单独的方法队列，但这是一个您不应该依赖的实现细节。如果您不提供自己的方法队列，将来，您的原生模块的长时间运行操作可能会阻塞在其他无关的原生模块上执行的异步调用。例如，此处的 RCTAsyncLocalStorage 模块创建了自己的队列，以便 React 队列不会阻塞等待可能缓慢的磁盘访问。

- (dispatch_queue_t)methodQueue
{
 return dispatch_queue_create("com.facebook.React.AsyncLocalStorageQueue", DISPATCH_QUEUE_SERIAL);
}

指定的 methodQueue 将由模块中的所有方法共享。如果只有一个方法是长时间运行的（或由于某种原因需要在与其他方法不同的队列上运行），则可以在方法内部使用 dispatch_async 将该特定方法的代码在另一个队列上执行，而不会影响其他方法

RCT_EXPORT_METHOD(doSomethingExpensive:(NSString *)param callback:(RCTResponseSenderBlock)callback)
{
 dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
   // Call long-running code on background thread
   ...
   // You can invoke callback from any thread/queue
   callback(@[...]);
 });
}

在模块之间共享调度队列

methodQueue 方法将在模块初始化时调用一次，然后由 React Native 保留，因此无需自己保留对队列的引用，除非您希望在模块内使用它。但是，如果您希望在多个模块之间共享同一个队列，则需要确保为每个模块保留并返回相同的队列实例。

依赖注入

React Native 将自动创建和初始化任何已注册的原生模块。但是，您可能希望创建和初始化自己的模块实例，例如，注入依赖项。

您可以通过创建一个实现 RCTBridgeDelegate 协议的类，使用委托作为参数初始化一个 RCTBridge，并使用初始化的桥初始化一个 RCTRootView 来实现此目的。

id<RCTBridgeDelegate> moduleInitialiser = [[classThatImplementsRCTBridgeDelegate alloc] init];

RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:moduleInitialiser launchOptions:nil];

RCTRootView *rootView = [[RCTRootView alloc]
                        initWithBridge:bridge
                            moduleName:kModuleName
                     initialProperties:nil];

导出 Swift

Swift 不支持宏，因此在 React Native 内部将原生模块及其方法暴露给 JavaScript 需要更多设置。但是，它的工作原理基本相同。假设您有相同的 CalendarModule，但它是作为 Swift 类

// CalendarModule.swift

@objc(CalendarModule)
class CalendarModule: NSObject {

 @objc(addEvent:location:date:)
 func addEvent(_ name: String, location: String, date: NSNumber) -> Void {
   // Date is ready to use!
 }

 @objc
 func constantsToExport() -> [String: Any]! {
   return ["someKey": "someValue"]
 }

}

务必使用 @objc 修饰符来确保类和函数正确导出到 Objective-C 运行时。

然后创建一个私有实现文件，它将把所需的信息注册到 React Native 中。

// CalendarModuleBridge.m
#import <React/RCTBridgeModule.h>

@interface RCT_EXTERN_MODULE(CalendarModule, NSObject)

RCT_EXTERN_METHOD(addEvent:(NSString *)name location:(NSString *)location date:(nonnull NSNumber *)date)

@end

对于那些刚接触 Swift 和 Objective-C 的人来说，每当你在 iOS 项目中混合使用这两种语言时，你还需要一个额外的桥接文件（称为桥接头文件）来将 Objective-C 文件暴露给 Swift。如果你通过 Xcode 的文件>新建文件菜单选项将 Swift 文件添加到你的应用程序中，Xcode 会主动为你创建此头文件。你需要在这个头文件中导入RCTBridgeModule.h。

// CalendarModule-Bridging-Header.h
#import <React/RCTBridgeModule.h>

你还可以使用RCT_EXTERN_REMAP_MODULE 和_RCT_EXTERN_REMAP_METHOD 来更改你正在导出的模块或方法的 JavaScript 名称。有关更多信息，请参阅RCTBridgeModule。

创建第三方模块时重要提示：使用 Swift 的静态库仅在 Xcode 9 及更高版本中受支持。为了使 Xcode 项目在你使用包含在模块中的 iOS 静态库中的 Swift 代码时能够构建，你的主应用程序项目必须包含 Swift 代码和一个桥接头文件。如果你的应用程序项目不包含任何 Swift 代码，则可以使用一个空的 .swift 文件和一个空的桥接头文件作为解决方法。

保留的方法名称

invalidate()

原生模块可以通过实现invalidate()方法来遵循 iOS 上的RCTInvalidating协议。此方法可以在原生桥接失效时（例如：在开发模式重新加载时）被调用。请根据需要使用此机制来对你的原生模块进行必要的清理。