Swift 橋接頭不導出 React Native 類型

Question

我正在嘗試使用 Swift 為 React Native 應用程序創建本機 (iOS) 模塊。 我想在模塊上公開一個返回承諾的方法，使用RCTPromiseResolveBlock和RCTPromiseRejectBlock類型的函數，這兩個函數都在 React Native 的RCTBridgeModule.h標頭中聲明。 但是，對於這兩種類型，我的構建失敗並顯示消息“使用未聲明的類型...”。

我已經為另一個目的創建了一個橋接頭（自動使用 Xcode），所以我相信導入React/RCTBridgeModule.h是我需要提供上述類型的全部內容。 大概我配置錯誤，因為這不能解決問題。 我試過建立一個新項目，一切都按預期工作，但我似乎找不到會導致我的項目構建失敗的差異。

一些相關的配置細節：

• 橋接標頭名為<ProjectName>-Bridging-Header.h並存儲在我的源目錄中。 我移動了它以確認 Xcode 正在找到它（當它不在正確的位置時，構建會以不同的方式失敗）。
• 橋接頭的內容很簡單： #import <React/RCTBridgeModule.h>
• 在我的項目構建設置中：
  • <ProjectName>-Bridging-Header.h被配置為“Objective-C Bridging Header”
  • “安裝 Objective-C 兼容性標頭”設置為“是”
  • “預編譯橋接頭”設置為“是”
• 當我輸入別名時，缺少的類型項目按預期構建和運行
• 我安裝了一些第三方 Swift 庫（一個使用react-native link ，一個使用 Git 子模塊）
• 我試過清理構建文件夾，重新安裝node_modules並刪除 Xcode 派生數據，但都沒有效果。

我的項目是配置錯誤還是我錯過了一些重要的東西？

Answer 1

本教程非常擅長解釋如何使用 Swift 設置本機模塊。 它將所有內容分解為步驟，並且很容易遵循。

https://teabreak.e-spres-oh.com/swift-in-react-native-the-ultimate-guide-part-1-modules-9bb8d054db03

1. 設置
2. 如何向 JS 公開 Swift 類
3. 如何公開靜態 Swift 數據
4. 如何公開 Swift 方法
5. 如何使用回調公開方法
6. 如何將方法公開為 Promise
7. 如何公開事件發射器
8. 如何提取你的 React Native 模塊

顯然，您要執行的步驟是第 6 步。

這是一個代碼示例。 它與上面鏈接中所做的非常相似。 您的橋接頭應如下所示：

// <ProjectName>-Bridging-Header.h

#import "React/RCTBridgeModule.h"
#import "React/RCTEventEmitter.h"

---

你應該有名為ModuleName.m和ModuleName.swift文件。

// ModuleName.m
#import "React/RCTBridgeModule.h"
#import "React/RCTEventEmitter.h"
@interface RCT_EXTERN_MODULE(ModuleName, NSObject)
// this is how we expose the promise to the javascript side.
RCT_EXTERN_METHOD(functionWithPromise: (RCTPromiseResolveBlock)resolve rejecter: (RCTPromiseRejectBlock)reject)
@end

---

// ModuleName.swift

@objc(ModuleName)
class ModuleName: NSObject {
  @objc
  func constantsToExport() -> [AnyHashable : Any]! {
    return ["projectName": "ModuleName"]
  }

  @objc
  static func requiresMainQueueSetup() -> Bool {
    return true
  }

  @objc
  func functionWithPromise(
    _ resolve: RCTPromiseResolveBlock,
    rejecter reject: RCTPromiseRejectBlock
  ) -> Void {
    if (//something bad happens) {
      let error = NSError(domain: "", code: 200, userInfo: nil)
      reject("ERROR_FOUND", "failure", error)
    } else {
      resolve("success")
    }
  }
}

---

然后在 Javascript 端，您可以像這樣訪問它：

import { NativeModules } from 'react-native'

NativeModules.Counter.functionWithPromise()
    .then(res => console.log(res))
    .catch(e => console.log(e.message, e.code))