时间戳

首页 > 解决方案 > 如何使标签栏的指示线在顶部不在底部

react-native - 如何使标签栏的指示线在顶部不在底部

问题描述

我正在使用 React-Native。在到处搜索之后，我仍然不知道如何使底部标签的指示线位于顶部或底部。有没有可能？

我已经尝试过indicatorStyle但它不起作用。有没有人有想法或建议？

const MyTabNavi = createBottomTabNavigator(
    {
      ...
    },
    {
        tabBarOptions: {
            ....
            indicatorStyle: {
                paddingBottom: 300,
                backgroundColor: '#46ff46',
                height: 50,
            }
        }
    }

标签： react-nativereact-navigation

解决方案

indicatorStyle 仅存在于 TopTabNavigator 中。请参阅下面的文档：

顶部 tabBarOptions： https ://reactnavigation.org/docs/material-top-tab-navigator#tabbaroptions

底部 tabBarOptions： https ://reactnavigation.org/docs/bottom-tab-navigator/#tabbaroptions

在 TopTabNavigator 中，指标线默认显示。目前在 React Navigation 中存在一个错误...当设置 tabStyle 背景颜色时，指示线消失。请参阅以下问题： https ://github.com/react-navigation/react-navigation/issues/8012

推荐阅读