react native svg

react-native-svg提供了SVG支持，可以在iOS，Android，MacOS，Windows和Web的兼容层上进行反应。

查看示例应用程序

• 特征
• 安装
• 故障排除
• 开幕问题
• 用法
• 已知问题

特征

1. 支持大多数SVG元素和属性（Rect，Circle，Line，Polyline，Polygon，G ...）。
2. 易于将SVG代码转换为React-Native-SVG。

安装

与博览会

✅Expo客户端应用程序随附安装本机代码！

使用以下方式安装JavaScript

npx expo install react-native-svg

有关更多信息，请参见世博文档，或者提前进行使用。

与反应新的-CLI

1. 安装库

   来自NPM

   npm install react-native-svg

   来自纱线

   yarn add react-native-svg

2. 链接本地代码

    cd ios && pod install

支持的反应新版本

反应-SVG	反应本
3.2.0	0.29
4.2.0	0.32
4.3.0	0.33
4.4.0	0.38
4.5.0	0.40
5.1.8	0.44
5.2.0	0.45
5.3.0	0.46
5.4.1	0.47
5.5.1	> = 0.50
> = 6	> = 0.50
> = 7	> = 0.57.4
> = 8	> = 0.57.4
> = 9	> = 0.57.4
> = 12.3.0	> = 0.64.0
> = 15.0.0	> = 0.70.0
> = 15.8.0	> = 0.73.0

支持面料

Fabric是React Native的新渲染系统。从该项目的13.0.0版本开始，面料仅适用于反应的0.69.0+。由于配置的破坏，因此无法支持早期版本。

反应-SVG	反应本
> = 13.0.0	0.69.0+
> = 13.6.0	0.70.0+
> = 13.10.0	0.72.0+

故障排除

意外行为

如果您的行为出乎意料，请创建一个带有最新版本的React-Native和React-Native-SVG的清洁项目

react-native init CleanProject
cd CleanProject/
yarn add react-native-svg
cd ios && pod install && cd ..

在App.js中复制问题

react-native run-ios
react-native run-android

添加窗口支持

1. npx react-native-windows-init --overwrite
2. react-native run-windows

开幕问题

验证上一步中指定的最新版本仍然是一个问题。如果是这样，请打开一个新问题，包括整个App.js文件，指定您已测试的平台以及运行此命令的结果：

react-native info

如果您怀疑自己找到了一个规格符合的错误，则可以通过构造此代码和框来使用React-Native-Web项目中的组件进行测试，以查看不同的浏览器如何呈现相同的内容：https：//codesandbox.io /s/pypn6mn3y7如果任何具有重要用户群或其他SVG用户代理的常绿浏览器会更好地呈现一些SVG内容，或者支持更多SVG和相关规格，请尽快打开问题。

用法

要检查如何使用库，请参阅usage.md

已知问题：

1. 无法在Android上施加径向聚焦的焦点。

React Native SVG由软件大厦维护

自2012年以来，软件大厦是一家具有构建Web和移动应用程序经验的软件代理商。我们是本地贡献者和专家在处理各种反应本地问题方面的核心反应。我们可以帮助您建立下一个梦想的产品 - 雇用我们。