React本机标题栏:删除水平线(React本地UI Kitten +React导航)

Question

在我的应用程序中使用运行在react-native-ui-kitten上的BottomNavigation和BottomNavigationTab组件(Expov2.21.2，react-native v0.57.1 )，当前选定的BottomNavigationTab顶部有一条水平线，其中包含标题和图标。

来自我的应用程序的：

测试B选项卡被选中，图标上方有多余的水平线。

​

​

文档中的：

docs显示，当定义了标题和图标时，所选选项卡上没有水平线。但对我来说不是这样。

​

​

问题：如何去除水平线？

我的代码：

import { View } from 'react-native';
import { createBottomTabNavigator, createStackNavigator, createSwitchNavigator, createAppContainer } from 'react-navigation';
import { BottomNavigation, BottomNavigationTab, BottomNavigationProps, Avatar } from 'react-native-ui-kitten';

class BottomNavigationShowcase extends React.Component {

    ... 

    render () {
        return (
            <BottomNavigation
                selectedIndex={this.state.selectedIndex}
                onSelect={this.onTabSelect}
            >
                <BottomNavigationTab title='Test A' icon={this.renderIconA} />
                <BottomNavigationTab title='Test B' icon={this.renderIconB} />
                <BottomNavigationTab title='Test C' icon={this.renderIconC} />
                <BottomNavigationTab title='Test D' icon={this.renderIconD} />
            </BottomNavigation>
        );
    }

}

const TabNavigator = createBottomTabNavigator(
    {
        TestA: TestAScreen,
        TestB: TestBScreen,
        TestC: TestCScreen,
        TestD: TestDScreen
    }, {
        initialRouteName: 'TestA',
        tabBarComponent: BottomNavigationShowcase
    }
)

const RootNavigator = createSwitchNavigator({
    Main: TabNavigator,
}, {
    initialRoute: "Main"
})

Answer 1

只需尝试向BottomNavigation-component：appearance='noIndicator'添加一个属性。看来我们忘了在文档中显示这种能力了。希望这能有所帮助。