反应原生矢量图标显示 X 而不是图标答案

【问题标题】：react native vector icons showing X instead of icon反应原生矢量图标显示 X 而不是图标
【发布时间】：2019-05-29 12:29:40
【问题描述】：

我似乎无法弄清楚这一点。我可以展示一些东西，但它是一个带有 X 的盒子，所以我假设它没有拾取矢量图标。有什么建议吗？

我有显示图标，我有色调，我有矢量图标（我尝试了离子图标和字体都很棒，但无济于事。

代码：

import React, { Component} from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createBottomTabNavigator, createAppContainer } from 'react- 
navigation';
import Icon from 'react-native-vector-icons/FontAwesome';

class HomeScreen extends Component {

    static navigationOptions = {
        title: 'Home'
    };

 render(){
     return (
         <View style={{ flex:1, alignItems:'center', justifyContent:'center' 
         }}>
             <Text>Home Screen</Text>
         </View>
     );
  }
  }

  const RootStack = createBottomTabNavigator(
      {
          Home: {
              screen: HomeScreen,
              navigationOptions: {
              tabBarLabel: 'Home',
              tabBarIcon: ({ tintColor }) => (
                  <Icon name = 'home' size={25} color={tintColor} />
              )
          }
      },
   },

   {
        tabBarOptions: {
        showIcon:true,
        tintColor:'red'
   }
  }
  );

  const AppContainer = createAppContainer(RootStack);

  const styles = StyleSheet.create({

 })

export default class App extends Component{
   render(){
   return <AppContainer />;
   }
}

【问题讨论】：

它是否显示任何错误或警告？
不是我看没有。如果我尝试使用 name='home'，它确实会警告我，给出我可以使用的大量名称列表。但是，当我选择一个时，同样的事情。损坏的图像图标（其中带有 x 的框）
所以你的问题不在于react-navigation，而在于react-native-vector-icons。这可能是配置问题，你用的是android还是ios？

标签： react-native react-native-vector-icons

【解决方案1】：

我使用的是 react-native 版本 0.62，我也遇到了这个错误。尽管 0.60+ 版本的 react native 提供了自动链接功能，但对于 react-native-vector-icons 这是一个例外。您需要手动链接它。要解决它，请按照以下步骤操作

rm -rf 节点模块
纱线
yarn react-native 链接

希望对您有所帮助。

【讨论】：

【解决方案2】：

解决了这个问题。一旦我意识到它是向量，我只是将 react-native 与 react-native-vectors 联系起来。

【讨论】：