title: Element type is invalid: expected string (for built in components) issue with React-navigation's TabBartIcon
body: <p><a href="https://i.stack.imgur.com/7DMKV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7DMKV.png" alt="enter image description here"></a></p>
  
  <p>When We want to include Ionicons inside the tab navigator in react-navigation it shows this error which looks like very strange, as far as we are using the guide of react-navigation how to implement it. Here is the code:</p>
  
  <pre><code>import { Ionicons } from "react-native-vector-icons";
  ..............
  .............
  ..............
  const TabsBar = TabNavigator(
    {
  
     Home: {screen: HomeScreen},
     Profile: {screen: ProfileScreen},
  
    },
  
      {
      navigationOptions: ({ navigation }) =&gt; ({
        tabBarIcon: ({ focused, tintColor }) =&gt; {
          const { routeName } = navigation.state;
          let iconName;
          if (routeName === 'Home') {
            iconName = 'search';
          } 
           else if (routeName === 'Profile') {
            iconName = 'contact';
          }
  
          return &lt;Ionicons name={iconName} size={25} color={tintColor} /&gt;;
        },
      }),
      tabBarOptions: {
        activeTintColor: '#222222',
        inactiveTintColor: '#222222',
      },
      tabBarComponent: TabBarBottom,
      tabBarPosition: 'bottom',
      animationEnabled: false,
      swipeEnabled: false,
      initialRouteName: 'Home'
  
    }
  );
  </code></pre>
  
  <p>We are using react-navigation version: 1.0.0-beta.21</p>
  
  <p>What is wrong in this code and how can we fix this issue?</p>