javascript - 如何集成第三方iOS sdk react native

Question

貌似react native可以集成iOS项目，作为普通的react组件使用，但是我看了官方文档，没有完整的demo，有没有简单的方法可以实现从头到尾？

Answer 1

你要找的是 React Native Modules

https://facebook.github.io/react-native/docs/native-modules-ios

在文档中，他们提供了以下示例，您可以遵循并实现，然后进行修改以满足您的需要。

日历管理器.h

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

@interface CalendarManager : NSObject <RCTBridgeModule>
@end

日历管理器.m

// CalendarManager.m
#import "CalendarManager.h"
#import <React/RCTLog.h>

@implementation CalendarManager

RCT_EXPORT_MODULE();

RCT_EXPORT_METHOD(addEvent:(NSString *)name location:(NSString *)location)
{
  RCTLogInfo(@"Pretending to create an event %@ at %@", name, location);
}

这个例子实际上并没有做任何事情，它只是创建了一个名为 CalendarManager.addEvent 的方法，您可以从 React Native 调用该方法，它将使用 RCTLog 控制台记录一些内容.

分割

• .h 文件 - 将 iOS 连接到 React Native 的头文件，除了显示的内容(已更改以匹配您的模块名称)外，这里几乎没有任何内容
• .m 文件 - 定义您在 JavaScript 中调用的方法的模块文件，可以在其中调用您的 SDK 方法。
• @implementation CalendarManager - 这是您命名模块的地方，因此您可以使用 NativeModules.CalendarManager
将其导入 ReactNative
• RCT_EXPORT_MODULE() - 定义此文件是 React Native 模块
• RCT_EXPORT_METHOD() - 定义您可以从 React Native 调用的方法。您可以拥有任意数量的此类产品。

在您的 RCT_EXPORT_METHOD() 定义中，您可以使用传递给它的任何参数调用您的 SDK。

说到参数，有不同的类型定义如下:

• string (NSString)
• number (NSInteger, float, double, CGFloat, NSNumber)
• boolean (BOOL, NSNumber)
• array (NSArray) of any types from this list
• object (NSDictionary) with string keys and values of any type from this list
• function (RCTResponseSenderBlock)