为什么react-navigation跳转其它页面（其它路径的组件），产生多个导航头？

Question

如题所述：react-navigation路由跳转时，当跳转其它路径的组件时，就会产生多个导航头；如果跳转到当前页面的其它组件，就不会出现多个导航头。

这是为什么？

Answer 1

页面是否有导航头是页面的navigationOptions中是否设置header为null决定的，举例如下：

{
 Home: {
        screen: Home,
        navigationOptions: {
            header:null   // 在这行设置，没有这行的话默认有导航头的
            }
        }    
}

补充一下，你可能需要的是下面的代码：

const Tab = TabNavigator({
    Home: {
        screen: Home,
        navigationOptions: {    
    },
    Find: {
        screen: Find,
        navigationOptions: {
 
        }
    },
    User: {
        screen: User,
        navigationOptions: {
            // 可以通过设置 , 去除此界面的标题栏
            header:null,
        }
    }
});

// 假如你想跳转的子界面去除底部的Tab，那么此screen需要和Tab在同一层次。
export default Navi = StackNavigator({
    Tab: {
        screen: Tab
    },
    Detail: {
        screen: Detail
    }
}, {navigationOptions: {
        // 可以通过 header:null去除所有界面的标题栏
    }
  });