RCTBridge需要dispatch_sync加载RCTDevLoadingView。这可能会导致死锁

Question

我在日志中得到这样的：

RCTBridge需要dispatch_sync加载RCTDevLoadingView。这可能导致 导致死锁

这导致了React中呈现的内容导致对齐问题的问题。

（见所附截图1）Screenshot with Issue

所有屏幕不显示对齐的问题这是随机发生的。

（参见附截图2）Screenshot without issue

我有布局使用样式的组件：

return(
    this.props.lastComponent ? 
    <CommentList marginLeft={this.props.marginLeft}> 
    <CommentUserPicWrapper imageWidth={this.props.imageWidth}> 
     {this.props.imageType === 'URL' ? <CommentUserPic source={{uri:this.props.uri}} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/> : <CommentUserPic source={require('../../img/defaultProfPic.png')} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/>} 
     { 
     this.state.loading ? null : <ActivityIndicator style={{position:'absolute'}}/> 
     } 
    </CommentUserPicWrapper> 
    <CommentDetails borderStatus={true} marginLeft={this.props.marginLeft}> 
     <CommentUserName>{this.props.userName} says</CommentUserName> 
     <CommentUserContent>{this.props.UserContent}</CommentUserContent> 
     <CommentUserDate><Text>{this.props.commentDate}</Text> at <Text>{this.props.commentTime}</Text>MST</CommentUserDate> 
    </CommentDetails> 
    <CommentReply onPress={this.replyClicked} borderStatus={true} underlayColor='transparent'> 
     <CommentReplyText>Reply</CommentReplyText> 
    </CommentReply> 
    </CommentList> 
    : 
    <CommentList marginLeft={this.props.marginLeft}> 
    <CommentUserPicWrapper imageWidth={this.props.imageWidth}> 
     {this.props.imageType === 'URL' ? <CommentUserPic source={{uri:this.props.uri}} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/> : <CommentUserPic source={require('../../img/defaultProfPic.png')} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/>} 
     {this.state.loading ? null : <ActivityIndicator style={{position:'absolute'}}/>} 
    </CommentUserPicWrapper> 
    <CommentDetails borderStatus={this.props.borderStatus} marginLeft={this.props.marginLeft}> 
     <CommentUserName>{this.props.userName} says</CommentUserName> 
     <CommentUserContent>{this.props.UserContent}</CommentUserContent> 
     <CommentUserDate><Text>{this.props.commentDate}</Text> at <Text>{this.props.commentTime}</Text>MST</CommentUserDate> 
    </CommentDetails> 
    <CommentReply onPress={this.replyClicked} borderStatus={this.props.borderStatus} underlayColor='transparent'> 
     <CommentReplyText>Reply</CommentReplyText> 
    </CommentReply> 
    </CommentList> 
) 

感谢。

Answer 1

我有如下更新AppDelegate.m固定它：

#if RCT_DEV 
#import <React/RCTDevLoadingView.h> 
#endif 
... 
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
{ 
    ... 
    RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:jsCodeLocation 
              moduleProvider:nil 
              launchOptions:launchOptions]; 
#if RCT_DEV 
    [bridge moduleForClass:[RCTDevLoadingView class]]; 
#endif 
    RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge 
                moduleName:@"<AddYourAppNameHere>" 
              initialProperties:nil]; 
    ... 
} 

来源： devburmistro的答案2017年12月10日来源：https://github.com/facebook/react-native/issues/16376