javascript - Expo反应本机元素类型无效：预期为字符串或类/函数但得到：未定义

问题描述

如果这是一个转储问题，我会尝试学习 react-native 抱歉。

我使用托管流创建了一个带有 expo init 的演示应用程序。并尝试使用 react-native-sideswipe 在主屏幕中添加轮播。

我找到了一个示例小吃并尝试将其添加到我的应用程序中。但是我在 HomeScreen.js 中收到 Carousel 组件的此错误：

不变违规：不变违规：元素类型无效：需要一个字符串（对于内置组件）或一个类/函数（对于复合组件），但得到：未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。

我无法弄清楚问题是什么，我该如何解决。我检查组件和道具是否存在于我正在使用的版本中。

App.js 的相关部分：

  const [isLoadingComplete, setLoadingComplete] = useState(false);

  if (!isLoadingComplete && !props.skipLoadingScreen) {
    return (
      <AppLoading
        startAsync={loadResourcesAsync}
        onError={handleLoadingError}
        onFinish={() => handleFinishLoading(setLoadingComplete)}
      />
    );
  } else {
    return (
      <View style={styles.container}>
        {Platform.OS === 'ios' && <StatusBar barStyle="default" />}
        <AppNavigator />
      </View>
    );
  }
}

AppNavigator.js 的相关部分

import React from 'react';
import { createAppContainer, createSwitchNavigator } from 'react-navigation';

import MainTabNavigator from './MainTabNavigator';

export default createAppContainer(
  createSwitchNavigator({
    // You could add another route here for authentication.
    // Read more at https://reactnavigation.org/docs/en/auth-flow.html
    Main: MainTabNavigator,
  })
);

MainTabNavigator.js 的相关部分

import React from 'react';
import { Platform } from 'react-native';
import { createStackNavigator, createBottomTabNavigator } from 'react-navigation';

import HomeScreen from '../screens/HomeScreen';
const config = Platform.select({
  web: { headerMode: 'screen' },
  default: {},
});

const HomeStack = createStackNavigator(
  {
    Home: HomeScreen,
  },
  config
);

Homesreen.js：

import React from 'react';
import {
  Animated,
  Easing,
  Image,
  Platform,
  ScrollView,
  StyleSheet,
  Text,
  TouchableOpacity,
  View,
  Dimensions,
} from 'react-native';
import { Constants } from 'expo';
import { MonoText } from '../components/StyledText';

import { Carousel, AnimatedCarouselItem } from 'react-native-sideswipe';
import { Card, Badge } from 'react-native-elements';

const { width } = Dimensions.get('window');
const data = [1, 2, 3, 4, 5];

export default function HomeScreen() {
  return (
    <View style={styles.container}>
      <ScrollView
        style={styles.container}
        contentContainerStyle={styles.contentContainer}>
        <View style={styles.welcomeContainer}>
          <Image
            source={require('../assets/images/logo.png')}
            style={styles.headerImage}
          />
        <Carousel
          data={data}
          style={{ width, maxHeight: 225 }}
          itemWidth={width}
          threshold={120}
          contentOffset={0}
          renderItem={({ item }) => (
            <View style={{ width: width, paddingHorizontal: 10 }}>
              <Card
                title="Local Modules"
                containerStyle={{ maxWidth: width, height: 225 }}>
                <Badge value={item} />
                <Text style={{ marginTop: 10 }}>
                  Science
                </Text>
              </Card>
            </View>
          )}
        />
        </View>
        <View style={styles.helpContainer}>


        </View>
      </ScrollView>

      <View style={styles.tabBarInfoContainer}>


      </View>
    </View>
  );
}

谢谢你的帮助！

标签： javascriptreact-nativeexpo

javascript - Expo反应本机元素类型无效：预期为字符串或类/函数但得到：未定义

问题描述

解决方案

推荐阅读