react-native - React-Native App 在导航时崩溃
问题描述
将 React-Native App 升级到以下配置后
“反应”:“16.9.0”,“反应原生”:“0.61.5”,“反应导航”:“^4.0.10”,“反应导航堆栈”:“^1.10.3”, “react-navigation-drawer”:“^2.3.3”,“react-redux”:“^7.1.3”,“redux”:“^4.0.4”,“redux-promise”:“^0.6.0 ", "redux-saga": "^1.1.3"
使用 createStackNavigator 页面中的“this.props.navigation.navigate()”重定向时,应用程序崩溃。但是当我从 createDrawerNavigator 重定向到同一页面时,它可以工作。在升级之前,这工作正常。
TypeError: Cannot read property 'state' of undefined
This error is located at:
in Navigator (at createKeyboardAwareNavigator.js:12)
in KeyboardAwareNavigator (at SceneView.js:9)
in SceneView (at StackViewLayout.tsx:889)
in RCTView (at StackViewLayout.tsx:888)
in RCTView (at StackViewLayout.tsx:887)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at StackViewCard.tsx:106)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at screens.native.js:71)
in Screen (at StackViewCard.tsx:93)
in Card (at createPointerEventsContainer.tsx:95)
in Container (at StackViewLayout.tsx:975)
in RCTView (at screens.native.js:101)
in ScreenContainer (at StackViewLayout.tsx:384)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at StackViewLayout.tsx:374)
in PanGestureHandler (at StackViewLayout.tsx:367)
in StackViewLayout (at withOrientation.js:30)
in withOrientation (at StackView.tsx:104)
in RCTView (at Transitioner.tsx:267)
in Transitioner (at StackView.tsx:41)
in StackView (at createNavigator.js:80)
in Navigator (at createKeyboardAwareNavigator.js:12)
in KeyboardAwareNavigator (at SceneView.js:9)
in SceneView (at SwitchView.js:12)
in SwitchView (at createNavigator.js:80)
in Navigator (at createAppContainer.js:430)
in NavigationContainer (at App.js:42)
in Provider (at App.js:41)
in RCTView (at Root.js:14)
in Root (at connectStyle.js:392)
in Styled(Root) (at App.js:40)
in App (at renderApplication.js:40)
in RCTView (at AppContainer.js:101)
in RCTView (at AppContainer.js:119)
in AppContainer (at renderApplication.js:39)
reportException @ ExceptionsManager.js:44
handleException @ ExceptionsManager.js:113
showErrorDialog @ ReactFiberErrorDialog.js:45
showErrorDialog @ ReactNativeRenderer-dev.js:16635
logCapturedError @ ReactNativeRenderer-dev.js:16641
logError @ ReactNativeRenderer-dev.js:16747
callback @ ReactNativeRenderer-dev.js:18042
callCallback @ ReactNativeRenderer-dev.js:7595
commitUpdateEffects @ ReactNativeRenderer-dev.js:7639
commitUpdateQueue @ ReactNativeRenderer-dev.js:7630
commitLifeCycles @ ReactNativeRenderer-dev.js:17115
commitLayoutEffects @ ReactNativeRenderer-dev.js:20002
invokeGuardedCallbackImpl @ ReactNativeRenderer-dev.js:307
invokeGuardedCallback @ ReactNativeRenderer-dev.js:531
commitRootImpl @ ReactNativeRenderer-dev.js:19767
unstable_runWithPriority @ scheduler.development.js:643
runWithPriority @ ReactNativeRenderer-dev.js:5591
commitRoot @ ReactNativeRenderer-dev.js:19589
runRootCallback @ ReactNativeRenderer-dev.js:18709
(anonymous) @ ReactNativeRenderer-dev.js:5642
unstable_runWithPriority @ scheduler.development.js:643
runWithPriority @ ReactNativeRenderer-dev.js:5591
flushSyncCallbackQueueImpl @ ReactNativeRenderer-dev.js:5638
flushSyncCallbackQueue @ ReactNativeRenderer-dev.js:5627
scheduleUpdateOnFiber @ ReactNativeRenderer-dev.js:18556
enqueueSetState @ ReactNativeRenderer-dev.js:7799
Component.setState @ react.development.js:325
Transitioner._this.handleTransitionEnd @ Transitioner.js:1
_callTimer @ JSTimers.js:148
callTimers @ JSTimers.js:399
__callFunction @ MessageQueue.js:436
(anonymous) @ MessageQueue.js:111
__guard @ MessageQueue.js:384
callFunctionReturnFlushedQueue @ MessageQueue.js:110
(anonymous) @ debuggerWorker.js:69
Show 5 more frames
ExceptionsManager.js:44 TypeError: Cannot read property 'state' of undefined
This error is located at:
in NavigationContainer (at App.js:42)
in Provider (at App.js:41)
in RCTView (at Root.js:14)
in Root (at connectStyle.js:392)
in Styled(Root) (at App.js:40)
in App (at renderApplication.js:40)
in RCTView (at AppContainer.js:101)
in RCTView (at AppContainer.js:119)
in AppContainer (at renderApplication.js:39)
reportException @ ExceptionsManager.js:44
handleException @ ExceptionsManager.js:113
showErrorDialog @ ReactFiberErrorDialog.js:45
showErrorDialog @ ReactNativeRenderer-dev.js:16635
logCapturedError @ ReactNativeRenderer-dev.js:16641
logError @ ReactNativeRenderer-dev.js:16747
update.callback @ ReactNativeRenderer-dev.js:18010
callCallback @ ReactNativeRenderer-dev.js:7595
commitUpdateEffects @ ReactNativeRenderer-dev.js:7639
commitUpdateQueue @ ReactNativeRenderer-dev.js:7627
commitLifeCycles @ ReactNativeRenderer-dev.js:17138
commitLayoutEffects @ ReactNativeRenderer-dev.js:20002
invokeGuardedCallbackImpl @ ReactNativeRenderer-dev.js:307
invokeGuardedCallback @ ReactNativeRenderer-dev.js:531
commitRootImpl @ ReactNativeRenderer-dev.js:19767
unstable_runWithPriority @ scheduler.development.js:643
runWithPriority @ ReactNativeRenderer-dev.js:5591
commitRoot @ ReactNativeRenderer-dev.js:19589
runRootCallback @ ReactNativeRenderer-dev.js:18709
(anonymous) @ ReactNativeRenderer-dev.js:5642
unstable_runWithPriority @ scheduler.development.js:643
runWithPriority @ ReactNativeRenderer-dev.js:5591
flushSyncCallbackQueueImpl @ ReactNativeRenderer-dev.js:5638
flushSyncCallbackQueue @ ReactNativeRenderer-dev.js:5627
scheduleUpdateOnFiber @ ReactNativeRenderer-dev.js:18556
enqueueSetState @ ReactNativeRenderer-dev.js:7799
Component.setState @ react.development.js:325
Transitioner._this.handleTransitionEnd @ Transitioner.js:1
_callTimer @ JSTimers.js:148
callTimers @ JSTimers.js:399
__callFunction @ MessageQueue.js:436
(anonymous) @ MessageQueue.js:111
__guard @ MessageQueue.js:384
callFunctionReturnFlushedQueue @ MessageQueue.js:110
(anonymous) @ debuggerWorker.js:69
Show 5 more frames
ExceptionsManager.js:44 TypeError: Cannot read property 'state' of undefined
This error is located at:
in NavigationContainer (at App.js:42)
in Provider (at App.js:41)
in RCTView (at Root.js:14)
in Root (at connectStyle.js:392)
in Styled(Root) (at App.js:40)
in App (at renderApplication.js:40)
in RCTView (at AppContainer.js:101)
in RCTView (at AppContainer.js:119)
in AppContainer (at renderApplication.js:39)
但是当我从 createDrawerNavigator 重定向到同一页面时,它可以工作。
非常感谢任何帮助。
解决方案
这是问题react-navigation": "^4.0.10
版本 4.0 仅适用于 Android 9 及以下版本,我们必须降级版本 3
通过降级版本,问题得到修复。这对我有用
"react": "^16.12.0",
"react-native": "^0.61.5"
"react-native-gesture-handler": "^1.5.3",
"react-navigation": "3.11.0"
推荐阅读
- ruby-on-rails - 测试权威人士使用第三个参数创建操作
- angular - 为什么我的组件没有通过指令显示 ContentChild?
- javascript - Litelement - 表格排序呈现错误值
- python - 树莓派使用网络摄像头输出到网站以查看
- python - Python简单的嵌套循环
- filter - 从可视化过滤器中排除指标
- arrays - 如何在C语言中不指定数组大小的情况下将数字读入数组
- javascript - 如何从firebase实时数据库中渲染ScrollView React Native(expo cli)中的数据?
- javascript - 级联下拉菜单在 mvc 中返回未定义
- java - 选择 clean 时 Eclipse 没有构建整个工作区复选框