最近公司項目需求,需要封裝一些關(guān)于iOS原生的組件提供給RN調(diào)用,在本文中做一些總結(jié)。希望能幫助到大家!
關(guān)于組件的封裝步驟
1.創(chuàng)建一個類,并且遵守RCTBridgeModule協(xié)議。
2.準守RCTBridgeModule必須引入RN的兩個頭文件#import<React/RCTBridgeModule.h>和#import <React/RCTLog.h>
3.為了實現(xiàn)RCTBridgeModule協(xié)議,你的類需要包含RCT_EXPORT_MODULE();宏。這個宏也可以添加一個參數(shù)用來指定在Javascript中訪問這個模塊的名字。
4.提供給RN調(diào)用的方法:RCT_EXPORT_METHOD(方法名稱:(類型)參數(shù)名) {實現(xiàn)方法}
5.帶有回調(diào)參數(shù)的方法實現(xiàn):RCT_EXPORT_METHOD(方法名:(RCTResponseSenderBlock)callback) {callback(@[返回值]);}這個方法RCTResponseSenderBlockRN接收回調(diào)的方法。
6.該方法提供屬性給RN調(diào)用:RCT_EXPORT_VIEW_PROPERTY(屬性名, 類型)。
7.如果你的項目中有一些常量的屬性需要開始的時候返回給RN使用可以實現(xiàn)該方法- (NSDictionary *)constantsToExport{return @{ @"ValueOne": @"返回的常量" };}實現(xiàn)該方法RN那邊會把你返回的字典保存起來,以便以后調(diào)用,具體實現(xiàn)流程不清楚如果有大神知道可以告訴我一下,在此謝過。
以上是封裝組件原生需要實現(xiàn)的方法。
RN調(diào)用原生組件步驟
//使用NativeModules可以訪問我們準守RCTBridgeModule的原生類
import { NativeModules } from 'react-native';
//獲取原生封裝的類
var manager = NativeModules.你的原生類名;
//使用對象調(diào)用方法
manager.方法名(參數(shù));
以上是RN調(diào)用原生代碼
當我們封裝好的iOS組件要如何導(dǎo)出到RN的文件夾,不依賴于iOS項目?
1.首先我們要創(chuàng)建一個靜態(tài)庫
2.打開我們的靜態(tài)庫,保存到你的RN項目里要保存的文件夾里。
3.靜態(tài)庫配置

在該設(shè)置中添加值為$(SRCROOT)/../../react-native/React,并設(shè)置為recursive。
4.設(shè)置完成后打開iOS項目文件

添加完成后需要把我們的靜態(tài)庫導(dǎo)入iOS項目中

添加完成后,我們的項目就可以使用我們導(dǎo)出的iOS原生組件了。