如何在 React Native 中使用不同的圖標庫？

Question

大家下午好。

我在代碼開頭指定了確切的庫

import Ionicons from 'react-native-vector-icons/FontAwesome';

我有一個關於如何一起使用不同矢量庫的問題。 例如>>

<Tab.Navigator
  screenOptions={({ route }) => ({
    tabBarIcon: ({ focused, color, size }) => {
      let iconName;

      if (route.name === 'Dashboard') {
        iconName = 'dashboard';
      } else if (route.name === 'Trades') {
        iconName = 'compare-arrows';
      }

      // You can return any component that you like here!
      return <Ionicons name={iconName} size={size} color={color} />;
    },
  })}
>

正如您在此處看到的Dashboard ，我使用iconName = 'dashboard'; 來自 FontAwesome 庫。

但是，如果我想從另一個庫（比如AntDesign ）為Trades添加圖標，我應該怎么做？ 我如何為每個元素指定不同的圖標庫？ 如果我想從另一個不同的庫中添加更多圖標？

簡而言之：我如何添加多個圖標庫並一起使用它們中的圖標。

Answer 1

從這里使用我的要點之一

https://gist.github.com/saachitech/02633cb443e121b4a792c537cdedc385

你可以像這樣使用它

Import Fonticon from “./fontIcon”;

<Fonticon type={“FontAwesome”} name={“some name”} size={10} color={“#FFF”} />

type可以是矢量圖標庫中的任何內容。