topTabNavigator 标签未显示

Question

我有以下 tobtabNavigator，但标签未显示，我不知道为什么。它只是空白，如下所示

import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';
const Tab = createMaterialTopTabNavigator();
const DeustchScreen = () => {
  return (
    <Tab.Navigator
      screenOptions={{
        tabBarLabelStyle: {fontSize: 12, color: 'red'},
      }}>
      <Tab.Screen name="a" component={Deutsch} />
      <Tab.Screen name="b" component={Deutsch} />
      <Tab.Screen name="c" component={Deutsch} />
      <Tab.Screen name="d" component={Deutsch} />
      <Tab.Screen name="e" component={Deutsch} />
      <Tab.Screen name="f" component={Deutsch} />
      <Tab.Screen name="g" component={Deutsch} />
    </Tab.Navigator>
  );
};

Answer 1

您可以在此小吃中检查，您的代码正在运行：

https://snack.expo.dev/-aQ4MaWt7

希望有帮助。如有疑问请放心

Answer 2

我使用@react-native-community/viewpager而不是react-native-pager-view。另外，在 screenOptions 中，我需要指定

tabBarItemStyle: {width:100}

Answer 3

我也有同样的错误。帮助我