reactjs - 如何在 React-Native 中渲染 svg 图像？

Question

请尽力帮助我!我需要在 android 和 ios View 上从我的文件夹“project/assest/images/test.svg”渲染 svg 图像。

我已经尝试过:

解决方案 1:<Image source={imagePath}></Image>

解决方案 2:

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

解决方案 3:首先，我应该将 svg 文件转换为 png、jpeg，然后渲染简单的图像，但 View 的方式非常奇怪

请帮忙，我做错了什么。

Answer 1

您也可以尝试react-native-svg SVG 包

例如——

import * as React from 'react';
import { SvgUri } from 'react-native-svg';

export default () => (
  <SvgUri
    width="100%"
    height="100%"
    uri="http://thenewcode.com/assets/images/thumbnails/homer-simpson.svg"
  />
);