React Native IOS Bridge Native View - 從 JS 端調用 Native Method 的正確方法

Question

我想討論我遇到的從 JS 端的 IOS ViewManager/View 調用本機方法而不使用屬性而是直接方法調用的選項。

選項A：

在 ViewManager 中實現一個方法，該方法搜索正確的視圖並在視圖中調用給定的方法，如下所示：

func callMethodViaManager(_ node:NSNumber) {
DispatchQueue.main.async {
let myView = self.bridge.uiManager.view(forReactTag: node) as! MyView
myView.myMethod()
  }
}

然后在 JS 端實現這樣的處理程序：

 const handleSomething = (e) => { 
  UIManager.dispatchViewManagerCommand(
  ReactNative.findNodeHandle(ref.current),
  UIManager.SwiftComponent.Commands.callMethodViaManager,
  [])
 };

這只是相關部分的簡短摘要，完整的過程可以在完整的細節中看到，可能只是有點陳舊，但通過一些調整，它也可以與功能組件一起工作：

https://medium.com/@jjdanek/react-native-calling-class-methods-on-native-swift-views-521faf44f3dc

選項B：

對於此選項，讓我們選擇最佳方案，即可以通過委托或其他一些模式或 Swift 糖在 ViewManager 上准備好所有必要的數據、設置等。

使用 NativeModules 直接從 JS 端調用 ViewManager 中的 Native 方法，如下所示：

 const handleSomething = (e) => { 
 NativeModules.MyViewManager.myMethod()
 };

我找不到太多關於此選項與正在橋接的本機視圖相關的信息，這種方式明確用於本機模塊橋接。 我唯一能找到的地方：

React Native UI 組件方法

或像這樣的指南：

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

我已經嘗試了這兩種方法，乍一看它們似乎都有效。

所以我的問題是：

為什么選項 A是更好的解決方案/選項，也是推薦或最常用的解決方案/選項？

選項 B有什么問題或可能出錯？

還有什么要考慮的嗎？

有沒有更好的方法而不是低谷屬性？

Answer 1

選項 B 更靈活。

如果使用選項 A，則無法將Promise和Callback參數傳遞給本機端。

這在 iOS 中似乎是可能的，但在 Android 中則不然。

這是一個相關的問題。

React Native 橋接 API 令人困惑

沒有關於如何使用Promise或Callback調用本機 UI 方法的指南。

有一個關於如何通過調用本機 UI 實例方法將Promise傳遞給本機端的示例。

SketchView...只是我的示例模塊名稱。

class SketchViewModule(reactContext: ReactApplicationContext) : ReactContextBaseJavaModule(reactContext) {
    override fun getName() = "SketchViewModule"

    private fun runCommandWithPromise(
        viewId: Int, promise: Promise, handler: (view: SketchView) -> Unit
    ) {
        reactApplicationContext.getNativeModule(UIManagerModule::class.java)?.let { uiManager ->
            uiManager.addUIBlock {
                (it.resolveView(viewId) as? SketchView)?.let { view ->
                    handler(view)
                } ?: run {
                    promise.safeReject("[runCommandWithPromise] Cannot find View with UIManager")
                }
            }
        }
    }
...