检查`MaterialTopTabNavigator`的呈现方法 [英] Check the render method of `MaterialTopTabNavigator`

问题描述

我要创建一个Top Tab导航器，并将两个屏幕Badges.js和Studying.js放入Tab中。在我的设备上运行它时，收到错误消息：&q；错误：元素类型无效：需要字符串.和&q；检查`MaterialTopTabNavigator&q；的呈现方法。

。

TabScreen.js

import React from 'react';
import {View, Image, Text} from 'react-native';
import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';
import Badges from './Badge';
import Studying from './Studying';

const Tab = createMaterialTopTabNavigator();

const TabsScreen = () => {
  return (
    <Tab.Navigator>
      <Tab.Screen name="Badges" component={Badges} />
      <Tab.Screen name="Studying" component={Studying} />
    </Tab.Navigator>
  );
};
export default TabsScreen;

Badges.js

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

const Badges = () => {
  return (
    <View>
      <Text>Badges</Text>
    </View>
  );
};

export default Badges;

Studying.js

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

const Studying = () => {
  return (
    <View>
      <Text>Studying</Text>
    </View>
  );
};

export default Studying;

推荐答案

确保以下所有软件包的版本相同

"@react-navigation/material-top-tabs": "^6.0.1",
"@react-navigation/native": "^6.0.1",
"@react-navigation/stack": "^6.0.1",

这篇关于检查`MaterialTopTabNavigator`的呈现方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！