错误：元素类型无效：应为字符串（对于内置组件）或类/函数（对于复合函数）但得到：未定义

Question

我在使用@react-navigation/material-top-tabs 时遇到以下错误。

我已检查我的导入，它们已正确导入。当我使用以前版本的 react-native-tabs 时，它工作正常。我在 @react-navigation/material-top-tabs github 问题中没有发现类似的问题。以下是我的实现：

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


    renderHeader = () => {
            const Tab = createMaterialTopTabNavigator();
        
            let initialRootNameScreen = "ScreenA";
            if (
              this.props.route.params != undefined &&
              this.props.route.params != null
            ) {
              if (
                this.props.route.params.from != undefined &&
                this.props.route.params.from != null
              ) {
                initialRootNameScreen = this.getInitialRouteNameFromProfile(
                  this.props.route.params.from
                );
              } else {
                initialRootNameScreen = this.getInitialRouteName();
              }
            } else {
              initialRootNameScreen = this.getInitialRouteName();
            }
            return (
              <Tab.Navigator
                tabBarPosition= "top"
                backBehavior= "none"
                initialRouteName= {initialRootNameScreen}
                lazy= {false}
                removeClippedSubviews= {false}
                animationEnabled= {false}
                swipeEnabled= {false}
        
                tabBarOptions= {{
                  upperCaseLabel: false,
                  scrollEnabled: true,
                  activeTintColor: Colors.white,
                  inactiveTintColor: Colors.white_50,
                  labelStyle: {
                    fontSize: 16,
                    fontFamily: Strings.APP_FONT,
                  },
                  style: {
                    backgroundColor: Colors.BACKGROUND_BLUE_COLOR,
                    height: Platform.OS === "ios" ? 68 : 75,
                  },
                  indicatorStyle: {
                    backgroundColor: Colors.white,
                  },
                  tabStyle: {
                    width: viewportWidth / 3,
                    alignSelf: "center",
                  },
                }}
              >
                <Tab.Screen
                  name="ScreenA"
                  children={() => (
                    <ScreenA />
                  )}
                />
                <Tab.Screen
                  name="ScreenB"
                  children={() => (
                    <ScreenB />
                  )}
                />
                <Tab.Screen
                  name="ScreenC"
                  children={() => (
                    <ScreenC />
                  )}
                />
              </Tab.Navigator>
            );
          };

我不知道我错过了什么。任何帮助，将不胜感激。谢谢。

Answer 1

Tab.Screen 组件上没有子道具。

替换为：

<块引用>