有条件动态导入javascript中的图像以进行反应

Question

在react / javascript中导入图像的通常方法是这样的：

import image from './img/img3.png';
...
<div>
<img src={image} />
</div>

我希望通过以下方式有条件地在javascript中导入图像：img文件夹中有以下几种格式的图像-img1.png，img2.png，img3.png等。我想计算哪个图片导入到javascript文件中，然后仅导入该图片，如下所示：

  filename = `./img/img${num}.png`
    import(filename);
    ...
    <div>
    <img src={filename} />
    </div>

任何想法如何去做呢？

Answer 1

我找到了答案。 对于有条件的图像导入，请执行以下操作：

<img src={require(`./img/${imageNum}.png`)} alt="Img" className={classes.Img} />