React native 反应本机反应本机矢量图标：如何使用字体图标

在我的react本机应用程序中，我添加了此库react本机向量图标以使用图标。在github页面中，FontAwesome列在捆绑图标集中。但是我不知道如何在我的元素中引用一个项目。似乎我只能使用“ios xxx”、“md xxx”或“log xxx”

当我尝试类似于：

我得到这个警告：

使用

从'react native vector icons/fontsome'导入图标；

始终在此处和此处搜索图标名称：以确保使用的名称正确。然后，您可以简单地将代码用作：

import Icon from 'react-native-vector-icons/FontAwesome';
<Icon name="rocket" size={30} color="#900" />    // Here use the correct
 name from the first link above.

从'react native vector icons/fontsome'导入图标；
//这里使用正确的
来自上面第一个链接的名称。

有关更多信息，请参阅查看，找到您的图标并单击类ie中的详细信息：

<i class="fas fa-home"></i>

让道具

faHome

在你的代码中使用

faHome

而不使用“-”

您可以尝试键入，VSCode会提示下面类似图标的图像的名称：

---

因为它们的数量非常多，我不想全部导入，所以我最终将需要的每个图标导入为SVG

• 下载字体真棒免费软件包

• 将

  react native svg

  添加到项目中

然后将其粘贴到JSX文件中

import * as React from "react";

import { SvgXml, SvgProps } from 'react-native-svg'

const xml = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M470.1 231.3s7.6 37.2 9.3 45H446c3.3-8.9 16-43.5 16-43.5-.2.3 3.3-9.1 5.3-14.9l2.8 13.4zM576 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h480c26.5 0 48 21.5 48 48zM152.5 331.2L215.7 176h-42.5l-39.3 106-4.3-21.5-14-71.4c-2.3-9.9-9.4-12.7-18.2-13.1H32.7l-.7 3.1c15.8 4 29.9 9.8 42.2 17.1l35.8 135h42.5zm94.4.2L272.1 176h-40.2l-25.1 155.4h40.1zm139.9-50.8c.2-17.7-10.6-31.2-33.7-42.3-14.1-7.1-22.7-11.9-22.7-19.2.2-6.6 7.3-13.4 23.1-13.4 13.1-.3 22.7 2.8 29.9 5.9l3.6 1.7 5.5-33.6c-7.9-3.1-20.5-6.6-36-6.6-39.7 0-67.6 21.2-67.8 51.4-.3 22.3 20 34.7 35.2 42.2 15.5 7.6 20.8 12.6 20.8 19.3-.2 10.4-12.6 15.2-24.1 15.2-16 0-24.6-2.5-37.7-8.3l-5.3-2.5-5.6 34.9c9.4 4.3 26.8 8.1 44.8 8.3 42.2.1 69.7-20.8 70-53zM528 331.4L495.6 176h-31.1c-9.6 0-16.9 2.8-21 12.9l-59.7 142.5H426s6.9-19.2 8.4-23.3H486c1.2 5.5 4.8 23.3 4.8 23.3H528z"/></svg>`

export const VisaIcon = (props: SvgProps) => <SvgXml xml={xml} {...props} />

import*as React from“React”；
从“react native svg”导入{SvgXml，SvgProps}
常量xml=``
导出常量VisaIcon=（道具：SvgProps）=>

---

不要忘记将

宽度

、

高度

和

填充

属性传递到您的图标。

感谢您的快速回答。我尝试了您的代码：，仍然是相同的错误，除非您在项目中使用图标，否则该图标在捆绑包中不可用。因此，我们不必担心列表中图标的数量会更多。