Rn 底部导航

import { createBottomTabNavigator } from “react-navigation”;
import Ionicons from “react-native-vector-icons/Ionicons”;

import React from “react”;

import HomeScreen from “./HomeScreen”;
import NewTopRoute from “./NewTopRoute”;
import MyScreen from “./MyScreen”;

const HomeBottomRoute = createBottomTabNavigator(
{
Home: {
screen: HomeScreen,
navigationOptions: {
title: “首页”
}
},
New: {
screen: NewTopRoute,
navigationOptions: {
title: “消息”
}
},
My: {
screen: MyScreen,
navigationOptions: {
title: “我的”
}
}
},
{
tabBarOptions: {
activeTintColor: “#ffffff”,
inactiveTintColor: “#2296F3”,

  activeBackgroundColor: "#2296F3",
  inactiveBackgroundColor: "#ffffff"
},
navigationOptions: ({ navigation }) => ({
  tabBarIcon: ({ tintColor }) => {
    const { routeName } = navigation.state;
    let iconName;
    if (routeName === "Home") {
      iconName = "ios-document";
    } else if (routeName === "New") {
      iconName = "ios-create";
    } else if (routeName === "My") {
      iconName = "ios-person";
    }

    return <Ionicons name={iconName} size={25} color={tintColor} />;
  }
})

}
);

export default HomeBottomRoute;