Tab navigator icons in React Navigation

Figured it out had to add

tabBarOptions: { 
   showIcon: true 
},

After this the icon showed.


You can also simply add it with the help of Tab.Screen

First Import the icon from expo

import { Ionicons } from '@expo/vector-icons';

or choose any icons from here: https://icons.expo.fyi/

Then use it like this

<Tab.Screen
    name="Feed"
    component={Feed}
    options={{
      tabBarLabel: 'Home',
      tabBarIcon: ({ color, size }) => (
        <Ionicons name="home" color={color} size={size} />
      ),
    }}
  />

This works for me, without enable showIcon:true.

I am using Ionicons icon pack.

HomeScreen:{
    screen:HomeScreen,
    navigationOptions: {
      tabBarLabel:"Home",
      tabBarIcon: ({ tintColor }) => (
        <Icon name="ios-bookmarks" size={20}/>
      )
    },
  },