react native 0.43 升级后问题：点击警告框（下面的黄色框）会使应用崩溃

Posted 2023-02-18

【中文标题】react native 0.43 升级后问题：点击警告框（下面的黄色框）会使应用崩溃

【英文标题】：react native 0.43 post upgrade problems: clicking warning box(yellow box below) makes app crash down

【发布时间】：2017-09-25 07:30:04

【问题描述】：

我尝试将 react-native 从 0.42 升级到 0.43，看起来还不错，没有重大错误或冲突。 但是当我在模拟器中运行我的应用程序时，单击屏幕底部的警告框（黄色的），突然应用程序崩溃了。 ReactNative 不打印任何错误日志，所以我用 xcode 试了一下。 错误日志如下所示

2017-04-12 19:18:06.838 [error][tid:main][UIView+React.m:173] Invalid 
layout for (15)<RCTScrollView: 0x7ffa34e3cb70; reactTag: 15; frame = (0 
233; 414 0); clipsToBounds = YES; layer = <CALayer: 0x600000223fc0>>. 
position: 207, nan. bounds: 0, 0, 414, nan
2017-04-12 19:18:06.844 MyProject[17665:385202] *** Terminating app due 
to uncaught exception 'CALayerInvalidGeometry', reason: 'CALayer 
position contains NaN: [0 nan]'
*** First throw call stack:
(
0 CoreFoundation 0x0000000112136d4b __exceptionPreprocess + 171
1 libobjc.A.dylib 0x0000000110b9921e objc_exception_throw + 48
2 CoreFoundation 0x00000001121a02b5 +[NSException raise:format:] + 197
3 QuartzCore 0x00000001146aef92 _ .ZN2CA5Layer12set_positionERKNS_4Vec2IdEEb + 152
4 QuartzCore 0x00000001146af107 -[CALayer setPosition:] + 44
5 QuartzCore 0x00000001146af772 -[CALayer setFrame:] + 650
6 UIKit 0x0000000114d079b4 -[UIWebDocumentView _notifyContentHostingLayersOfScaleChange] + 111
7 UIKit 0x0000000114d02b61 -[UIWebDocumentView setFrame:] + 287
8 UIKit 0x00000001150dfc95 -[UIWebBrowserView setFrame:] + 199
9 UIKit 0x0000000114d50fc9 -[UIWebView _frameOrBoundsChanged] + 508
10 UIKit 0x0000000114d51096 -[UIWebView setFrame:] + 166
11 MyProject 0x000000010ff121d9 -[RCTWebView layoutSubviews] + 185
12 UIKit 0x0000000114a8bab8 -[UIView(CALayerDelegate) layoutSublayersOfLayer:] + 1237
13 QuartzCore 0x00000001146b8bf8 -[CALayer layoutSublayers] + 146
14 QuartzCore 0x00000001146ac440 _ZN2CA5Layer16layout_if_neededEPNS_11TransactionE + 366
15 QuartzCore 0x00000001146ac2be _ZN2CA5Layer28layout_and_display_if_neededEPNS_11TransactionE + 24
16 QuartzCore 0x000000011463a318 _ZN2CA7Context18commit_transactionEPNS_11TransactionE + 280
17 QuartzCore 0x00000001146673ff _ZN2CA11Transaction6commitEv + 475
18 QuartzCore 0x0000000114667d6f _ZN2CA11Transaction17observer_callbackEP19__CFRunLoopObservermPv + 113
19 CoreFoundation 0x00000001120db267 CFRUNLOOP_IS_CALLING_OUT_TO_AN_OBSERVER_CALLBACK_FUNCTION + 23
20 CoreFoundation 0x00000001120db1d7 __CFRunLoopDoObservers + 391
21 CoreFoundation 0x00000001120bff8e __CFRunLoopRun + 1198
22 CoreFoundation 0x00000001120bf884 CFRunLoopRunSpecific + 420
23 GraphicsServices 0x0000000117c3ea6f GSEventRunModal + 161
24 UIKit 0x00000001149c6c68 UIApplicationMain + 159
25 MyProject 0x000000010fe3c5cf main + 111
26 libdyld.dylib 0x000000011639b68d start + 1
27 ??? 0x0000000000000001 0x0 + 1
)
libc++abi.dylib: terminating with uncaught exception of type NSException
(lldb)

有什么想法吗？

更新： 只需删除 ios/build 文件夹即可解决崩溃！ 但我有一个新问题.. 当我单击黄色警告框时，屏幕中的视图会消失，并在关闭警告框时再次显示。我相信警告框是半透明的，我可以通过黄色框看到屏幕中的视图，直到反应原生 0.42。

所以我用 react-native init 尝试了一个全新的项目。

export default class Test extends Component 
  render() 
    const data = [1,2,3,4,5];
    return (
      <View style=flex: 1 onLayout=e =>console.log(e.nativeEvent.layout.height)>
        <Text style=styles.instructions>
        Press Cmd+R to reload,'\n'
        Cmd+D or shake for dev menu
      </Text>
  <ScrollView style=styles.container onLayout=(e) => console.log(e.nativeEvent.layout.height)>
    <View style=backgroundColor: 'red', flex: 1>
      <Text style=styles.welcome>
        Welcome to React Native!
      </Text>
      data.map(d => <Text>d</Text>)
      <Text style=styles.instructions>
        To get started, edit index.ios.js
      </Text>
    </View>
  </ScrollView>
  </View>
);
  

上面的代码会在从 data.map 函数返回的视图中生成关于“key prop”的警告消息。 当我单击黄色框将其最大化时，两个 onLayout 函数会打印“0”，然后在我关闭该框时再次打印实际值。 它是从本地反应过来的吗？

【问题讨论】：

请分享任何相关代码。

@dmorrow 很抱歉，但这只是我点击警告框时发生的错误。你指的是什么类型的代码？

@dmorrow 我更新了问题

【参考方案1】：

没关系。这是一个错误并修复为 react native 0.44 https://github.com/facebook/react-native/releases/tag/v0.44.0