错误:元素类型无效:应为字符串 - 使用 NativeBaseProvider 后出现此错误

时间:2021-07-12 05:03:23

标签: android ios reactjs react-native native-base

我将原生库从 2.13.14 升级到 3.0.3,并将我的 App.js 内容包装在 NativeBaseProvider 中。这是我执行此操作后得到的错误:

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

--

我的代码:

import React, {useEffect} from 'react';
import {I18nManager, ActivityIndicator} from 'react-native';
import {NavigationContainer} from '@react-navigation/native';
import {NativeBaseProvider, Container} from 'native-base';

import TrackPlayer from 'react-native-track-player';
import {PlayerContextProvider} from './contexts/PlayerContext';
import MainStackNavigator from './Navigators/MainStackNavigator';

const App = () => {
  const [isReady, setIsReady] = React.useState(false);

  useEffect(() => {
    TrackPlayer.setupPlayer().then(() => {
      console.log('player is setup');

      TrackPlayer.updateOptions({
        capabilities: [
          TrackPlayer.CAPABILITY_PLAY,
          TrackPlayer.CAPABILITY_PAUSE,
          TrackPlayer.CAPABILITY_STOP,
          TrackPlayer.CAPABILITY_JUMP_BACKWARD,
          TrackPlayer.CAPABILITY_JUMP_FORWARD,
        ],
        jumpInterval: 30,
      });
      setIsReady(true);
    });
  }, []);
  return (
    <NativeBaseProvider>
      <Container>
        {isReady ? (
          <PlayerContextProvider>
            <NavigationContainer>
              <MainStackNavigator />
            </NavigationContainer>
          </PlayerContextProvider>
        ) : (
          <Container>
            <ActivityIndicator />
          </Container>
        )}
      </Container>
    </NativeBaseProvider>
  );
};

I18nManager.forceRTL(true);

export default App;

1 个答案:

答案 0 :(得分:0)

尝试将 forceRTL 方法移到应用初始化的 useEffect 中。

喜欢:

useEffect(() => {
    I18nManager.forceRTL(true);    // here..
    TrackPlayer.setupPlayer().then(() => {

它可能会帮助你。