4

我正在尝试使用一些本机 UI 组件和一些 React 组件构建一个 react-native 应用程序。我想要一个本机 ui 组件，它将反应组件作为属性，并将其呈现为子视图。

我经历了制作原生 ui 组件并用于RCT_EXPORT_VIEW_PROPERTY(view, RCTView)获取视图属性的正常过程。

PagedUIViewManager.swift：

@objc(PagedUIViewManager)
class PagedUIViewManager: RCTViewManager {
  override func view() -> UIView! {
    return PagedUIView();
  }
  override static func requiresMainQueueSetup() -> Bool {
    return true
  }
}

PagedUIView.swift：

class PagedUIView: UIView {
  @objc var view: UIView {
    didSet {
      for subview in self.subviews {
        subview.removeFromSuperview()
      }
      self.addSubview(view)
    }
  }
  override init(frame: CGRect) {
    self.view = UIView(frame: frame)
    super.init(frame: frame)
    self.addSubview(view)
  }
}

PagedUIViewManager.m:

#import "React/RCTViewManager.h"
@interface RCT_EXTERN_MODULE(PagedUIViewManager, RCTViewManager)
RCT_EXPORT_VIEW_PROPERTY(view, RCTView)
@end

PagedUINativeView.js：

const PagedUI = requireNativeComponent("PagedUIView");
export default class PagedUIView extends React.Component {
  render() {
    return <PagedUI {...this.props}/>;
  }
}

用法：

<PagedUIView view={<ComponentToRender />} />

我希望视图显示<ComponentToRender />，但我收到运行时错误“Invariant Violation: 435,PagedView,1,[object Object] is not used as a native method argument”。

4

1 回答 1

1

目前不可能，将视图传递给本机模块的唯一方法是将视图作为子模块传递。

您可以使用以下方式接收视图：

@objc override func insertReactSubview(_ subview: UIView!, at atIndex: Int)
于 2019-10-08T21:00:26.690 回答