在没有导入的情况下使用JSX在React中显示图像

Question

我面临的问题是使用img标签。当单个而言， 下面的代码加载图像：

import image1 from './images/image1.jpg; 
<img src={image1} /> 

但是，下面的代码不会加载：

<img src={'./images/image1.jpg'}/> 
      or 
    <img src='./images/image1.jpg'/> 

我需要遍历JSON，像[{“IMG '：'./ images/image1.jpg'，'name'：'AAA'}，{'img'：'./ images/image2.jpg'，'name'：'BBB'}]并显示每一个作为名称为页脚的图像。循环很好，但图像无法加载。实际上，我自己无法导入每个要添加的图像。截至目前，我除了使用JSX之外不使用其他任何软件。请高兴。

Answer 1

需要导入文件像这样：

<img src={ require('./images/image1.jpg') } /> 

Answer 2

require用于静态“进口”，那么你只需要改变你的imports。

例子：

var imageName = require('./images/image1.jpg') 
<img src={imageName} />