Question

有谁知道我如何拥有本机UIViewController或推送React Native视图，并在两者之间来回移动？

如果可能的话，我想在UIViewController中加载React Native视图，这样我就可以保留导航栏，但是使用React Native视图。

我一直在阅读documentation，但我找不到任何有用的东西。

我尝试过这样的组合：

//  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:nil launchOptions:nil];
//  RCTRootView *reactView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"My Test" initialProperties:nil];

    NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
    RCTRootView *reactView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                         moduleName:@"My Test"
                                                  initialProperties:nil
                                                      launchOptions:nil];

    reactView.frame = self.view.frame;
    [self.view addSubview:reactView];

我不太清楚我是否理解它是如何知道我希望它使用的.js React文件，或者我如何指定它。

Answer 1

要使这种方法起作用，至少需要：

访问您所有System.out.printIn("Enter Integer: "); int newInteger = scan.nextLine(); While (newInteger >= 0){ System.out.println("Re-enter Integer (must be negative): "); newInteger = scan.nextLine(); } n+=newInteger; Counter = counter - 1; return n;可以共享的网桥。如果您希望每个根视图从同一个包中加载不同的RN组件 - 他们需要共享相同的RCTRootView
RCTBridge，其视图为UIViewController。然后，您可以将此视图控制器用作导航控制器的根，以模态方式显示它，就像您已经尝试过的那样。

让我们来看看这个想法的一个非常简单的示例实现。

1。保存共享桥的对象

部首：

RCTRootView

实现：

#import <Foundation/Foundation.h>
#import "RCTBridge.h"

@interface ReactBridgeManager : NSObject
@property (nonatomic, strong, readonly) RCTBridge *bridge;
-(instancetype)initWithBundleURL:(NSURL *)bundleURL launchOptions:(NSDictionary *)launchOptions;
@end

2。控制反应根视图的视图控制器

标题

#import "ReactBridgeManager.h"

@interface ReactBridgeManager () <RCTBridgeDelegate>
@property (nonatomic, strong, readwrite) RCTBridge *bridge;
@property (nonatomic, strong) NSURL *bundleURL;
@end

@implementation ReactBridgeManager

- (instancetype)initWithBundleURL:(NSURL *)bundleURL launchOptions:(NSDictionary *)launchOptions
{
  self = [super init];
  if (self)
  {
    self.bundleURL = bundleURL;
    self.bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  }
  return self;
}

#pragma mark - RCTBridgeDelegate methods

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
  return self.bundleURL;
}

@end

实施

#import <UIKit/UIKit.h>
#import "RCTBridge.h"

@interface ReactViewController : UIViewController
- (instancetype)initWithBridge:(RCTBridge *)bridge moduleName:(NSString*)moduleName initialProps:(NSDictionary*)initialProps;
@end

3。用法示例

现在，您可以在必要时使用您的反应组件名称创建#import "ReactViewController.h" #import "RCTRootView.h" @implementation ReactViewController - (instancetype)initWithBridge:(RCTBridge *)bridge moduleName:(NSString*)moduleName initialProps:(NSDictionary*)initialProps { self = [super init]; if(self) { self.view = [[RCTRootView alloc] initWithBridge:bridge moduleName:moduleName initialProperties:initialProps]; } return self; } @end实例（这是在JS端注册到RN ReactViewController中的组件）并将其推送到您的本机导航堆栈，将它显示为模态等等。

AppRegistry

将其提升到新的水平

您可以查看基本上使用相同概念的React Native Navigation，以便为本机反应应用程序提供完全原生的导航解决方案。免责声明：我是开发此软件包的团队的一员：）

本机视图呈现React本机视图

1 个答案:

1。保存共享桥的对象

2。控制反应根视图的视图控制器

3。用法示例

将其提升到新的水平