React Native 以上错误发生在〈/static/media/igesticon.731bb908.svg>组件中

c6ubokkw  于 2023-02-19  发布在  React
关注(0)|答案(2)|浏览(130)

我有一个bug,一直让我很头疼,我打算把.svg图像到我的项目中,我尝试了几种方法,虽然它总是给我一个错误...我使用的是lib react-native-svg,我这样做的方式如下:
Error:访问〈/http:///www. html〉组件时发生了以下错误:在/静态/媒体/igesticon.731bb908.svg中

药物筛选

import React from 'react'
import { View, Text, FlatList, StyleSheet, Dimensions } from 'react-native'
import Logo from "../../assets/igesticon.svg";

const MedicationScreen = () => {
  return(
      <View>
          <Logo width={120} height={40} />
      </View>
  )
}
mzsu5hc0

mzsu5hc01#

可以通过以下方式嵌入SVG:

const MedicationScreen = () => {
  return(
      <View>
          <svg width={120} height={40} >
            <image href="../../assets/igesticon.svg" />
          </svg>
      </View>
  )
}

在下面的代码片段中了解它的工作原理:

<svg width="64" height="64" viewBox="30 0 200 200">
  <image href="https://upload.wikimedia.org/wikipedia/he/a/a7/React-icon.svg"/>
</svg>
6ss1mwsb

6ss1mwsb2#

当然,你不能这样导入svg。
你可以使用像SVGR这样的badass包。这个包会自动转换你的svg到react组件。
你可以像这样

import Star from './star.svg'

const Example = () => (
  <div>
    <Star />
  </div>
)

相关问题