TabBar 图标不显示并且选项在本机反应中不起作用

Question

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 />

Live preview

问题是图标不显示，标签可见，但我将 showLabel 设置为 false。

Answer 1

showIcon 和 showLabel 是 TabNavigator 本身的选项（在 tabBarOptions 下），而不是屏幕导航选项。

TabBar 图标不显示并且选项在本机反应中不起作用

TabBar icon don't show and options don't work in react native

javascript

reactjs

react-native

expo