Errors- React-Navigation tabBarIcon with FontAwesome

Expo SDK
1

Hi,

This is what my bottom tab navigator looks like:

It works fine when tabBarIcon and fails when I add FontAwesome… I’m following the react-navigation documents and not sure what could be the issue…

Any help would be much appreciated :slight_smile:

const SignedIn = createBottomTabNavigator(
  {
    CreateListing: {
      screen: CreateListingConnector,
      navigationOptions: {
        tabBarLabel: "Home",
        tabBarIcon: ({ tintColor }: any) => (
          <FontAwesome name="car" color={tintColor} size={24}/>
        )
      }
    },
    Profile: {
      screen: CreateListingConnector,
      navigationOptions: {
        tabBarLabel: "Profile",
        tabBarIcon: ({ tintColor }: any) => (
          <FontAwesome name="car" color={tintColor} size={24}/>
        )
      }
    }
  },
  {
    initialRouteName: "CreateListing",
    tabBarOptions: {
      activeTintColor: "#F8F8F8", // active icon color
      inactiveTintColor: "#586589", // inactive icon color
      style: {
        paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
        backgroundColor: "#171F33" // TabBar background
      }
    }
  }
);
2

ahhh so silly :\

just had to import
import * as React from “react”;

3

@ronifintech Glad you found the Solution.

Good Day!

4

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.