如何在React Native中使用SVG图像路径显示SVG图标？

Question

我想显示SVG图标，但是我找不到显示方法。我尝试使用react-native-svg的Image和Use组件，但是它们不能使用。而且我尝试用本机方式做到这一点，但仅显示SVG图标确实很困难。

示例代码：

<Svg width="80" height="80">
 <Image href={require('./svg/1f604.svg')} />
</Svg>

Answer 1

最初，当我的机器中装有svg图标或将其保存在网址中时，我遇到了同样的问题。 我浏览了所有react-native-svg库，但不包含已创建的svg图标的来源。我们可以在该库中创建新图标。

后来我发现了一个很好的库，我们可以在其中使用图标的Give路径并使用它。 react-native-svg-uri Github链接：https://github.com/vault-development/react-native-svg-uri

您可以像这样使用它

从“ react-native-svg-uri”导入SvgUri；

<SvgUri
 width="200"
 height="200"
 source={{uri:'http://thenewcode.com/assets/images/thumbnails/homer-simpson.svg'}}
/>