ReactNative中 React Navigation 嵌套使用问题 持续更新

1. TabNavigator中的页面是StackNavigator的是，点击Tab不能切换
   解决方案：使用 StackNavigator 中嵌套TabNavigator

//设置底部栏 -- Tabbar
const MainBottomTabNav = createBottomTabNavigator({
    首页: {
        screen: CustomTab1,
    },
    我的: {
        screen: CustomTab2,
    },
}, {
    animationEnabled: false, // 切换页面时不显示动画
    tabBarPosition: 'bottom', // 显示在底端，android 默认是显示在页面顶端的
    swipeEnabled: false, // 禁止左右滑动
    backBehavior: 'none', // 按 back 键是否跳转到第一个 Tab， none 为不跳转
    tabBarOptions: {
        activeTintColor: '#008AC9', // 文字和图片选中颜色
        inactiveTintColor: '#999', // 文字和图片默认颜色
        showIcon: true, // android 默认不显示 icon, 需要设置为 true 才会显示
        indicatorStyle: {
            height: 0
        }, // android 中TabBar下面会显示一条线，高度设为 0 后就不显示线了
        style: {
            backgroundColor: '#fff', // TabBar 背景色
        },
        labelStyle: {
            fontSize: 12, // 文字大小
        },
    },
});
//设置TabBar的title，如果和NavBar混合使用，这个是必须的
MainBottomTabNav.navigationOptions = ({
    navigation
}) => {
    let {
        routeName
    } = navigation.state.routes[navigation.state.index];

    let headerTitle = routeName;
    return {
        headerTitle
    };
};
//设置顶部栏 -- NavBar
const HomeNav = createStackNavigator({
    Home: {
        screen: MainBottomTabNav
    }
});
export default HomeNav;

2.嵌套使用的时候，无法设置NavBar的Title
解决方案：官网地址

//设置TabBar的title，如果和NavBar混合使用，这个是必须的
MainBottomTabNav.navigationOptions = ({
    navigation
}) => {
    let {
        routeName
    } = navigation.state.routes[navigation.state.index];

    let headerTitle = routeName;
    return {
        headerTitle
    };
};

3.嵌套使用时候，安卓导航不居中问题
解决方案：
（1）不嵌套的页面，使用修改headTitleStyle

static navigationOptions = { 
        headerTitleStyle:{
            flex: 1,
            textAlign: 'center',
        },
    }

（2）嵌套页面中使用上面方法没有效果，需要修改

node_modules/react-navigation/src/views/Header/Header.js

中 _renderTitle 方法

  // { justifyContent: layoutPreset === 'center' ? 'center' : 'flex-start' },
//修改为下面
      { justifyContent: layoutPreset === 'center' ? 'center' : 'center' },