小编che*_*ole的帖子

在 React Native 中当选项卡处于活动状态或不活动时更改选项卡栏图标

我在反应本机中有一个底部选项卡导航,如果选项卡处于活动状态,我希望它显示不同的图标,如果选项卡不处于活动状态,则显示另一个图标。我该如何实现它?我的代码如下

...
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)

javascript reactjs react-native

2
推荐指数
1
解决办法
8629
查看次数

标签 统计

javascript ×1

react-native ×1

reactjs ×1