我遇到TabBar react-navigation
| react-navigation 1.0.0-beta.13 |
| react-native 0.48.4|
| node v6.11.4 |
| npm 3.10.10 |
import React from 'react';
import {
Text,
Platform
} from 'react-native';
import { Constants } from "expo"
import {
TabNavigator
} from 'react-navigation';
import { Ionicons } from '@expo/vector-icons';
const MyHomeScreen = ({ navigation }) => (
<Text>HOME</Text>
);
const MyNotificationScreen = ({ navigation }) => (
<Text>NOTIFICATION</Text>
);
MyHomeScreen.navigationOptions = {
tabBarLabel: 'Home',
tabBarIcon: ({ tintColor, focused }) => (
<Ionicons
name={'md-checkmark-circle'}
size={26}
style={{ color: tintColor }}
/>
),
showIcon: true,
showLabel: false
};
MyNotificationScreen.navigationOptions = {
tabBarLabel: 'People',
tabBarIcon: ({ tintColor, focused }) => (
<Ionicons
name={'md-checkmark-circle'}
size={26}
style={{ color: tintColor }}
/>
),
showIcon: true,
showLabel: false
};
const App = TabNavigator(
{
Home: {
screen: MyHomeScreen,
},
Notifications: {
screen: MyNotificationScreen,
},
},
{
tabBarOptions: {
activeTintColor: Platform.OS === 'ios' ? '#e91e63' : '#fff',
},
}
);
export default () => <App />
问题是图标没有显示且标签可见,但我将showLabel
设置为false
。
答案 0 :(得分:0)
showIcon&amp; showLabel是TabNavigator本身的选项(在tabBarOptions下),而不是屏幕navigationOptions。