React-Native 橋接iOS原生開(kāi)發(fā)

react-native的文檔的原生模塊中可以看到清洗的代碼 傳送門

timg (1).jpeg

接下來(lái)先說(shuō)一下筆者的要實(shí)現(xiàn)的功能:
在iOS原生代碼中集成高德導(dǎo)航,在RN中用JS去調(diào)用原聲代碼,并進(jìn)行跳轉(zhuǎn),
接下來(lái)是筆者遇到的問(wèn)題與不好理解的地方,寫(xiě)出來(lái)跟大家分享讓大家少走彎路.
剛開(kāi)始也是一頭霧水且查資料也是到處都是但是都沒(méi)有解決問(wèn)題.

iOS原生寫(xiě)法

在iOS中創(chuàng)建類繼承NSObject(OC語(yǔ)言).

//類的.h文件
#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
#import <React/RCTLog.h>
#import <React/RCTUIManager.h>

@interface GaoMapManager : NSObject<RCTBridgeModule>

@end
// 類的.m文件
#import "GaoMapManager.h"
#import <AMapNaviKit/AMapNaviKit.h>
#import <UIKit/UIKit.h>
#import "GPSNaviViewController.h"
@implementation GaoMapManager

@synthesize bridge = _bridge;
RCT_EXPORT_MODULE();
RCT_EXPORT_METHOD
(
 pushViewControllerXYZ:(nonnull NSNumber *)reactTag
 )
{
  RCTUIManager *uiManager = _bridge.uiManager;
  GPSNaviViewController *gps = [[GPSNaviViewController alloc] init];
  dispatch_async(uiManager.methodQueue, ^{
    [uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary<NSNumber *,UIView *> *viewRegistry) {
      UIView * view = viewRegistry[reactTag];
      UIViewController *vc = (UIViewController *)view.reactViewController;
      [vc presentViewController:gps animated:YES completion:^{
        
      }];
    }];
  });
}

以上是全部iOS端的類文件的代碼.當(dāng)然繼承高德地圖是需要在AppDelegate.m文件中注冊(cè)高德apiKey(如果地圖不顯示,Xcode中會(huì)顯示錯(cuò)誤,apikey不生效需要10分鐘之后生效且一個(gè)key對(duì)應(yīng)一個(gè)app,否者會(huì)出錯(cuò))

RN中寫(xiě)法

看到這大家如果認(rèn)真看了上面的代碼,會(huì)注意到reactTag這個(gè)參數(shù),在JS中怎么傳這個(gè)參數(shù)呢,又代表著什么意思
其實(shí)很簡(jiǎn)單

import { NativeModules } from 'react-native';

export default NativeModules.GaoMapManager;

這是筆者寫(xiě)的一個(gè)untils的CommoniOSUtils.JS文件.調(diào)用的時(shí)候直接用文件名調(diào)用iOS原生的方法名即可

// findNodeHandle(this.homeHead)就是對(duì)應(yīng)的reactTag參數(shù)的值
 CommoniOSUtils.pushViewControllerXYZ(findNodeHandle(this.homeHead));

findNodeHandle引入方式

import {
  findNodeHandle,
} from 'react-native';

看到這里大家應(yīng)該清楚怎么回事了.我還要啰嗦一句具體是怎么個(gè)情況(個(gè)人理解)
在RN中用findNodeHandle方法去獲取ref控件的tag值,將這個(gè)值傳入到iOS原生中,再用
利用這個(gè)tag獲取當(dāng)當(dāng)前的view,根據(jù)view獲取當(dāng)前VC,用VC去跳轉(zhuǎn)頁(yè)面且傳值使用.完成調(diào)用

高德導(dǎo)航的一些坑

1,用pod引入的是5.3.0版本,demo中確實(shí)5.5.0版本,方法少了很多,自己修改一下問(wèn)題不大
2, iOS9以下會(huì)有內(nèi)存泄漏問(wèn)題,導(dǎo)致崩潰

最后

以往可以幫助到跟我遇到同樣問(wèn)題的同學(xué).分享也是加速學(xué)習(xí)的過(guò)程

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容