Question

我一直试图在我的React应用程序中与js文件添加到同一文件夹中的SVG文件，但是它显示了no image默认图像。我正在使用1.6.9 react应用程序

我尝试拖放SVG文件的内容，并且尝试在网上没有运气的情况下查找解决方案。

<img src={"dot.svg"}/>
<img src={"./dot.svg"}/>
<smg src="./dot.svg">

<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg 
PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" 
height="100%" viewBox="0 0 800 600" version="1.1" 
xmlns="http://www.w3.org/2000/svg" 
xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" 
xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip- 
rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke- 
miterlimit:1.5;"><ellipse cx="400" cy="300" rx="26.434" ry="25.114" 
style="fill:#00017f;stroke:#000;stroke-width:1px;"/></svg>

我想在我的React Application上显示SVG文件。

Answer 1

您需要执行此操作

<img src={require("./dot.svg")}/>

或

更准确地说是this，

import dot from './dot.svg';

<img src={dot} />

在React应用程序中显示SVG时遇到问题

1 个答案: