React native - TypeError：未定义不是评估_useContext的对象

Question

所以这有点奇怪。我的应用程序运行良好，上下文也运行良好。然而;每当我在调试模式下保存我的 apiHelpers.js 文件（具有各种 api 调用的对象）时，我的应用程序就会崩溃。

每次保存 - 无论我是否更改了某些内容，应用程序都会崩溃。只是文件上的cmd + S 使它崩溃。如果这只是一种奇怪的调试模式——很好，我可以忍受。我担心这是否可能是导致应用在生产环境中崩溃的问题的征兆。

错误：

TypeError: undefined is not an object (evaluating '_useContext2.getData')

This error is located at:
    in MyDashboard (at SceneView.js:9)
    in SceneView (at createTabNavigator.tsx:67)
    in RCTView (at ResourceSavingScene.tsx:37)
    in RCTView (at ResourceSavingScene.tsx:26)
    in ResourceSavingScene (at createBottomTabNavigator.tsx:157)
    in RCTView (at screens.native.js:101)
    in ScreenContainer (at createBottomTabNavigator.tsx:147)
    in RCTView (at createBottomTabNavigator.tsx:146)
    in TabNavigationView (at createTabNavigator.tsx:228)
    in NavigationView (at createNavigator.js:80)
    in Navigator (at SceneView.js:9)
    in SceneView (at StackViewLayout.tsx:900)
    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:52)
    in NavContainer (at App.js:130)
    in ToastProvider (at App.js:129)
    in AccountProvider (at App.js:128)
    in RCTView (at ActionSheet/index.ios.tsx:13)
    in ActionSheet (at ActionSheetProvider.tsx:30)
    in ActionSheetProvider (at App.js:127)
    in LoadingProvider (at App.js:126)
    in Provider (at App.js:125)
    in App
    in RCTView (at AppContainer.js:101)
    in RCTView (at AppContainer.js:119)
    in AppContainer (at renderApplication.js:39)

MyDashboard
    MyDashboard.js:28:4
renderRoot
    [native code]:0
runRootCallback
    [native code]:0
unstable_runWithPriority
    scheduler.development.js:643:23
Component.prototype.setState
    react.development.js:325:31
NavigationContainer#dispatch
    createAppContainer.js:377:22
navigate
    navigationRef.js:9:24
<anonymous>
    AuthContext.js:207:4
tryCatch
    runtime.js:45:44
invoke
    runtime.js:271:30
tryCatch
    runtime.js:45:44
invoke
    runtime.js:135:28
Promise$argument_0
    runtime.js:170:17
tryCallTwo
    core.js:45:7
doResolve
    core.js:200:23
Promise
    core.js:66:12
Promise$argument_0
    runtime.js:169:27
enqueue
    runtime.js:192:38
exports.async
    runtime.js:216:8
<anonymous>
    AuthContext.js:203:2
getAuth.then$argument_0
    App.js:81:41
tryCallOne
    core.js:37:14
setImmediate$argument_0
    core.js:123:25
_callTimer
    JSTimers.js:146:14
_callImmediatesPass
    JSTimers.js:194:17
callImmediates
    JSTimers.js:458:30
callImmediates
    [native code]:0
flushedQueue
    [native code]:0
invokeCallbackAndReturnFlushedQueue
    [native code]:0

我的进口：

import React, { useContext, useEffect, useState } from 'react';
import AccountContext from '../../context/AccountContext';
import LoadingContext from '../../context/LoadingContext';
import { Context as AuthContext } from '../../context/AuthContext';
import {
  StyleSheet,
  SafeAreaView,
  View,
  Text,
  TouchableOpacity,
  ScrollView,
  Image,
  Alert,
  Dimensions,
} from 'react-native';
import colors from '../../utils/colors';
import globalStyles from '../../utils/globalStyles';
import api from '../../api/apiHelpers';


const MyDashboard = ({ navigation }) => {
  const { showLoading } = useContext(LoadingContext);
  const { getData } = useContext(AccountContext);
  const { state } = useContext(AuthContext);

  return (
      <SafeAreaView style={styles.container}>
        <ScrollView
          contextContainerStyles={{ flexGrow: 1}}
          showsVerticalScrollIndicator={false}>
          <Text>
            MyDashboard
          </Text>
          <Text>
            Welcome, {getData.name}
          </Text>
        </ScrollView>
      </SafeAreaView>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

export default MyDashboard;

Answer 1

两天前我也遇到了同样的问题。我尝试重新安装或更新库并更新反应，阅读一些类似的问题我阅读了一些关于反应版本中的错误的内容，并解决了我的问题，但是在安装新库后，这个问题又回来了，我的应用程序仍然存在问题

错误文章：https://github.com/facebook/react/issues/14474

Answer 2

尝试检查 getData 之前或分配给这样的空对象：

const MyDashboard = ({ navigation }) => {
  const { showLoading } = useContext(LoadingContext);
  const { getData } = useContext(AccountContext);
  const { state } = useContext(AuthContext);

  if(!getData) return null // <- check this

  return (
      <SafeAreaView style={styles.container}>
        <ScrollView
          contextContainerStyles={{ flexGrow: 1}}
          showsVerticalScrollIndicator={false}>
          <Text>
            MyDashboard
          </Text>
          <Text>
            Welcome, {getData.name}
          </Text>
        </ScrollView>
      </SafeAreaView>
  );
};

希望对你有帮助

Answer 3

请试试这个

import {AccountContext} from '../../context/AccountContext';

import {LoadingContext} from '../../context/LoadingContext';