如何使用宗地在反应中添加图像？

Question

我一直试图在react中添加图像。我没有使用webpack，我正在使用parceljs。我也尝试使用typescript：

import image from path/to/image.png <img src={image} />

内部反应成分：

尝试：<img src="path/to/image.png" />

尝试：<img src={"path/to/image.png"} />

仍然，不起作用。

代码看起来像这样：

import * as React from 'react';

const componentName = () => (
  <div>
     <img src="path/to/image.png" />
  </div>
);

Answer 1

您需要这样做

dict(cursor)

然后在您的反应import image from 'path/to/image.png'; 中，遵循以下代码：

JSX

Answer 2

<img src="path/to/image.png"/>和<img src={"path/to/image.png"}/>之间没有什么不同，您应该import使用图像，然后将其用作JavaScript对象，如下所示：

import somePhoto from 'path/to/image.png';

您没有参加'path/to/image.png';并没有写任何内容。用引号输入您的路径。然后，在您的react JSX代码中，如下所示编写您的img标签：

<img src={somePhoto} />

还有更多不同的方式。在其他react项目中，我们使用另一台服务器来加载图像。但是要应用的特定图像应与上面类似。