美文网首页React Native开发指南
React-Native 原生模块调用(iOS)

React-Native 原生模块调用(iOS)

作者: 冷洪林 | 来源:发表于2017-01-10 10:56 被阅读151次

    成都React-Native交流群,进群给管理,先到先得哦

    在项目中遇到地图,拨打电话,清除缓存等iOS与Andiorid机制不同的功能,就需要调用原生的界面或模块,这里说下React Native调用iOS原生模块,Andiorid也是大同小异

    1.创建原生模块,实现“RCTBridgeModule”协议

    #import <Foundation/Foundation.h>
    #import "RCTBridgeModule.h"
    
    @interface KSDMapManager : NSObject <RCTBridgeModule>
    
    @end
    

    2 导出模块,导出方法

    @implementation KSDMapManager
    //导出模块
    RCT_EXPORT_MODULE();
    
    RCT_EXPORT_METHOD(gotoIM:(RCTResponseSenderBlock)callback)
    {
       __weak typeof(self) weakSelf = self;
      self.callback = callback;
    
      UIViewController *controller = (UIViewController*)[[[UIApplication sharedApplication] keyWindow] rootViewController];
      KSDMapLocationViewController *mapVc = [[KSDMapLocationViewController alloc] init];
      mapVc.handle = ^(NSString *address) {
        weakSelf.itemValue = address;
        NSArray *events = [[NSArray alloc] initWithObjects:self.itemValue, nil];
        callback(events);
      }; 
      [controller presentViewController:mapVc animated:YES completion:nil];
    }
    

    3 js文件中调用

    //创建原生模块实例
    var KSDMapManager = NativeModules.KSDMapManager;
    //方法调用
    KSDMapManager.gotoIM(
              (events)=>{
                this._inputReceiveAddress(events);
                console.log(events);
              })       
    
    

    相关文章

      网友评论

        本文标题:React-Native 原生模块调用(iOS)

        本文链接:https://www.haomeiwen.com/subject/jiskbttx.html