为react native添加导航－react-native-vector-icons

react native有自己提供的导航条，但是这里推荐使用react-native-vector-icons

按照以下步骤进行：

sudo npm i react-native-vector-icons@2.0.2 --save
sudo npm i rnpm@1.9.0 -g
下载好模块之后还不能直接使用，要执行一下步骤的其中之一
sudo react-native link react-native-vector-icons //先尝试这条
rnpm link react-native-vector-icons//上面不成功在尝试这样

成功提示：

rnpm-installinfoAndroid module react-native-vector-icons is already linked 

rnpm-installinfoiOS module react-native-vector-icons is already linked 

rnpm-installinfoLinking assets to ios project 

rnpm-installinfoLinking assets to android project 

rnpm-installinfoAssets have been successfully linked to your project 

想要什么图标就自己去对应的找名称：

http://fontawesome.io/icons/ 

用法可以参考：

https://github.com/oblador/react-native-vector-icons

案例：

var Icon=require('react-native-vector-icons/FontAwesome');

var {
 AppRegistry,
 StyleSheet,
 TabBarIOS,
 Text,
 View
} = react_native;

_renderContent: function(color: string, pageText: string, num?: number) {
 return (
   <View style={[styles.container, {backgroundColor: color}]}>
    <Text style={styles.tabText}>{pageText}</Text>
    <Text style={styles.tabText}>{num} re-renders of the {pageText}</Text>
   </View>
 );
}

return (
 <TabBarIOS
   tintColor="white"
   barTintColor="darkslateblue">
     <Icon.TabBarItem
      title="搜索"
      iconName="search"
      selectedIconName="search"
      selected={this.state.selectedTab === 'blueTab'}
      onPress={() => {
        this.setState({
          selectedTab: 'blueTab',
        });
      }}>
      {this._renderContent('#fff', 'Blue Tab')}
     </Icon.TabBarItem>

    <Icon.TabBarItem
      title="搜索"
      iconName="search"
      selectedIconName="search"
      selected={this.state.selectedTab === 'redTab'}
      onPress={() => {
        this.setState({
          selectedTab: 'redTab',
          notifCount: this.state.notifCount + 1,
        });
      }}>
      {this._renderContent('#fff', 'Red Tab', this.state.notifCount)}
     </Icon.TabBarItem>

     <Icon.TabBarItem
       title="搜索"
       iconName="search"
       selectedIconName="search"
       selected={this.state.selectedTab === 'greenTab'}
       onPress={() => {
          this.setState({
            selectedTab: 'greenTab',
            presses: this.state.presses + 1
          });
       }}>
       {this._renderContent('#fff', 'Green Tab', this.state.presses)}
      </Icon.TabBarItem>
  </TabBarIOS>
);

注意：TabBarIOS是react native自带，记得要接口声明出来

如果遇到模块下载了没有加载出来就参考：《解决：react native找不到加载模块》