import React, { Component } from "react";
import { createBottomTabNavigator } from "react-navigation";
import Ionicons from "react-native-vector-icons/Ionicons";
import ReList from "./ReList";
const Good = () => {
return <ReList tab="good" />;
};
const Share = () => {
return <ReList tab="share" />;
};
const Ask = () => {
return <ReList tab="ask" />;
};
const DiBu = createBottomTabNavigator(
// 底部导航栏
{
Good: {
screen: Good,
navigationOptions: {
title: "帖子"
}
},
Share: {
screen: Share,
navigationOptions: {
title: "发布"
}
},
Ask: {
screen: Ask,
navigationOptions: {
title: "我的"
}
}
},
{
navigationOptions: ({ navigation }) => ({
tabBarIcon: ({ tintColor }) => {
const { routeName } = navigation.state;
let iconName;
if (routeName === "Good") {
//切换不同的图标
iconName = `ios-document`;
} else if (routeName === "Share") {
iconName = `ios-create`;
} else if (routeName === "Ask") {
iconName = `ios-person`;
}
return <Ionicons name={iconName} size={25} color={tintColor} />;
}
})
}
);
export default ButtomNav;
底部导航栏的使用(加上图标)
猜你喜欢
转载自blog.csdn.net/qq_42832884/article/details/82740259
今日推荐
周排行