单个 App 中的多个 RCTRootView

Posted 2023-03-15

【中文标题】单个 App 中的多个 RCTRootView

【英文标题】：Multiple RCTRootView in a single App

【发布时间】：2015-07-13 10:04:38

【问题描述】：

我正在创建一个反应原生应用程序，但我需要使用目标 C 来构建我的自定义 UIView。但问题是这个 UIView 需要显示反应内容。例如一个反应文本输入和按钮。我正在考虑向自定义 UIView 添加一个 RCTRootView （它将具有这些反应组件），从而解决问题。但我目前正在使用一个 RCTRootView。我如何创建另一个并在我的代码中使用它。

编辑： 我确实明白我们可以从服务器 how-to-rename-react-native-entry-file-index-ios-js 添加不同的捆绑包，但是当我在本地运行时如何使用它。

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

【参考方案1】：

创建另一个 RCTRootView，就像创建任何其他 UIView 一样。

RCTRootView *someRootView = [[RCTRootView alloc] initWithBundleURL:someJsCodeLocation 
                                                        moduleName:@"SomeRootComponent" 
                                                     launchOptions:nil];

RCTRootView *anotherRootView = [[RCTRootView alloc] initWithBundleURL:anotherJsCodeLocation 
                                                           moduleName:@"AnotherRootComponent" 
                                                        launchOptions:nil];

您可以为所有 RCTRootView 指定相同的包 (jsCodeLocation)，或为每个 RCTRootView 指定不同的包。无论哪种情况，最好的做法是使用不同的组件名称 (moduleName)：

AppRegistry.registerComponent('SomeRootComponent', () => SomeRootComponent);

AppRegistry.registerComponent('AnotherRootComponent', () => AnotherRootComponent);

如果您想维护多个包，您需要使用以下命令编译每个包：

curl 'http://localhost:8082/index1.ios.bundle?dev=false&minify=true' -o iOS/main1.jsbundle

curl 'http://localhost:8082/index2.ios.bundle?dev=false&minify=true' -o iOS/main2.jsbundle

main1.jsbundle 和 main2.jsbundle 然后可以添加到您的项目中并正常引用。

【讨论】：

嗨，当我创建捆绑包时，index.io.js 名称对文件很重要。正如我所看到的， jsCodeLocation = [NSURL URLWithString:@"localhost:8081/index.ios.bundle"]; 或者我可以将两个 js 文件命名为 index1.io.js 用于第一个包，index2.io.js 用于第二个包和论文。

我确实知道我们可以从服务器 how-to-rename-react-native-entry-file-index-ios-js 添加不同的捆绑包，但是当我在本地运行时如何使用它。 jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

如果我在我的视图控制器中设置新的根视图，它将把它作为根或发生什么？你能解释清楚一点吗？

您可以将它们分别添加到同一个视图中，或者在应用程序的不同位置使用它们，或者将它们交替设置到视图控制器的根视图中。它们都是普通视图，这里的 UIKit 基础仍然适用。