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