美文网首页React Native开发
AppRegistry 应用入口

AppRegistry 应用入口

作者: AlanGit | 来源:发表于2019-04-25 18:56 被阅读5次

开发中index.js大概会有这样一段代码:

import InitApp from "./pages/home/InitApp";
AppRegistry.registerComponent('Eyepetizer', ()=>InitApp);

解释:

AppRegistry模块则是用来告知React Native哪一个组件被注册为整个应用的根容器.
1、可以用registerComponent 函数来注册多个模块。
2、与之对应的一个函数:AppRegistry.runApplication(appKey, appParameters), 最终使用这个函数来确定执行那个模块, 加载那个模块的js

执行过程如下:

1、
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                                   moduleName:@"ReactAir"
                                            initialProperties:nil];

  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  return YES;
}

2、源码函数中: 
- (instancetype)initWithBridge:(RCTBridge *)bridge
                    moduleName:(NSString *)moduleName
             initialProperties:(NSDictionary *)initialProperties
{
          ......
    [self bundleFinishedLoading:([_bridge batchedBridge] ?: _bridge)];
          ......
}

3、- (void)bundleFinishedLoading:(RCTBridge *)bridge {
          ......
    [self runApplication:bridge];
          ......
}

4、- (void)runApplication:(RCTBridge *)bridge {
          ......
  执行runApplication 函数
  [bridge enqueueJSCall:@"AppRegistry"
                 method:@"runApplication"
                   args:@[moduleName, appParameters]
             completion:NULL];
          ......
}

5、- (void)enqueueJSCall:(NSString *)module method:(NSString *)method args:(NSArray *)args completion:(dispatch_block_t)completion {
          ......
  这里将执行对应 js 方法
  strongSelf->_reactInstance->callJSFunction([module UTF8String], [method UTF8String],
                                             convertIdToFollyDynamic(args ?: @[]));
          ......
}

通常:
1、如果是一个跨平台的的项目这会有一个 js 入口。
2、如果是集成到原有的项目这可能需要多个 js 入口, 这时也就需要注册多个模块, 在原生对应的页面加载对应的模块。


内容参考:
https://blog.csdn.net/snow51/article/details/80590888

相关文章

网友评论

    本文标题:AppRegistry 应用入口

    本文链接:https://www.haomeiwen.com/subject/lqqtnqtx.html