RN navigation——tabNavigator（四）

先上代码如下
// 注册tabs
const Tabs = TabNavigator({
HomeTab: {
screen: MainScreen,
navigationOptions: { // 也可以写在组件的static navigationOptions内
tabBarLabel:'首页',//tab一的名称
tabBarIcon:({tintColor}) =>
()//这是名称上面要渲染的组件
}
},
BillTab: {
screen: MainScreen1,
navigationOptions: {
tabBarLabel:'账单',
tabBarIcon:({tintColor}) =>
()
}
}
}, {
animationEnabled: true, // 切换页面时是否有动画效果
tabBarPosition: 'bottom', // 显示在底端，android 默认是显示在页面顶端的
swipeEnabled: true, // 是否可以左右滑动切换tab
backBehavior: 'none', // 按 back 键是否跳转到第一个Tab(首页)， none 为不跳转
tabBarOptions: {
activeTintColor: '#ff8500', // 文字和图片选中颜色
inactiveTintColor: '#999', // 文字和图片未选中颜色
showIcon: true, // android 默认不显示 icon, 需要设置为 true 才会显示
indicatorStyle: {
height: 4 // 如TabBar下面显示有一条线，可以设高度为0后隐藏
},
style: {//这个样式是对整个tabNavigator生效的。
backgroundColor: '#fff', // TabBar 背景色
height: 60
},
labelStyle: {
fontSize: 10, // 文字大小
},
},
});
看这些注释已经够清楚了，通过代码切换tab方法：this.props.navigation.navigate('BillTab')，这样就切换过去，这里注意不要用全局的nav就可以了