在混合应用开发中,JavaScript(JS)与Objective-C(OC)之间的交互是常见的需求,尤其是在使用如React Native这类框架时。JS调用OC方法并传递参数的过程通常涉及桥接机制。
以下是一个简单的示例,展示如何在React Native中通过Native Modules实现JS调用OC方法并传递参数。
// MyOCModule.h
#import <React/RCTBridgeModule.h>
@interface MyOCModule : NSObject <RCTBridgeModule>
@end
// MyOCModule.m
#import "MyOCModule.h"
@implementation MyOCModule
RCT_EXPORT_MODULE();
RCT_EXPORT_METHOD(callOCMethod:(NSString *)param callback:(RCTResponseSenderBlock)callback) {
// 处理参数
NSString *result = [NSString stringWithFormat:@"OC received: %@", param];
// 调用回调,返回结果给JS
callback(@[result]);
}
@end
在AppDelegate.m
中注册模块:
#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import "MyOCModule.h"
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"MyApp" initialProperties:nil];
// 注册模块
[bridge moduleForClass:[MyOCModule class]];
// 其他初始化代码...
return YES;
}
@end
import { NativeModules } from 'react-native';
const { MyOCModule } = NativeModules;
MyOCModule.callOCMethod('Hello from JS', (result) => {
console.log(result); // 输出: OC received: Hello from JS
});
通过以上步骤,你可以在React Native中实现JS调用OC方法并传递参数的功能。如果遇到具体问题,可以根据错误信息进行调试和排查。
领取专属 10元无门槛券
手把手带您无忧上云