我在反应本机中有一个底部选项卡导航,如果选项卡处于活动状态,我希望它显示不同的图标,如果选项卡不处于活动状态,则显示另一个图标。我该如何实现它?我的代码如下
...
import { createBottomTabNavigator } from "react-navigation-tabs";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import HomeScreen from "../screens/HomeScreen";
...
export default createBottomTabNavigator({
HomePage: {
screen: HomeScreen,
navigationOptions: {
tabBarLabel: "Home",
tabBarIcon: ({ tintColor }) => (
<MaterialCommunityIcons
name='home'
color={tintColor}
size={28}
/>
)
}
},
....
{
tabBarOptions: {
showLabel: false,
activeTintColor: 'red',
inactiveTintColor: "grey"
}
}
})
Run Code Online (Sandbox Code Playgroud)