时间戳

首页 > 解决方案 > 正确的组件已通过但 React Native 错误：元素类型无效：预期为字符串或类/函数，但得到：未定义

reactjs - 正确的组件已通过但 React Native 错误：元素类型无效：预期为字符串或类/函数，但得到：未定义

问题描述

请参阅下面的错误我在我的 React Native 项目中得到

 ERROR  Warning: React.createElement: 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.

Check your code at MaterialTopTabView.tsx:51.
    in MaterialTopTabView (at createMaterialTopTabNavigator.tsx:44)
    in MaterialTopTabNavigator (at AuthTabs.js:14)

看截图

错误截图

请参阅下面的代码

AuthTabs.js

import React from 'react';
import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';

import SignIn from './tabs/SignIn';
import SignUp from './tabs/SignUp';

const Tab = createMaterialTopTabNavigator();

export default function AuthTabs() {
  return (
    <Tab.Navigator>
      <Tab.Screen
        name="SignIn"
        component={SignIn}
        options={({}) => ({
          tabBarLabel: 'Sign In',
        })}
      />
      <Tab.Screen
        name="SignUp"
        component={SignUp}
        options={({}) => ({
          tabBarLabel: 'Sign Up',
        })}
      />
    </Tab.Navigator>
  );
}

登入

import React from 'react';
import {View, Text} from 'react-native';

export default function SignIn() {
  return (
    <View>
      <Text>Singn In Screen</Text>
    </View>
  );
}

报名

import React from 'react';
import {View, Text} from 'react-native';

export default function SignUp() {
  return (
    <View>
      <Text>Sign Up Screen </Text>
    </View>
  );
}

我已经检查了所有类似的问题，但在任何地方都没有合适的解决方案请告诉我如何解决这个问题谢谢

标签： reactjsreact-native

解决方案

也许您的材料顶部选项卡的主要版本与反应导航不一致。

如果您使用的是 5.x，请运行此命令

yarn add @react-navigation/material-top-tabs@^5.x react-native-tab-view@^2.x

或者你可以将 react-navigation 升级到 6.x

推荐阅读