Question

我很好奇是否有更高效，更清洁的方法来导入picture1, picture2, picture3并随后在img标签中使用它们吗？实际上，我有更多图片，并且它添加了我希望避免的额外代码行。

我正在使用picture.js中的图片，

import {
  picture1,
  picture2,
  picture3,
} from './picture';

<img src={picture1} />
<img src={picture2} />
<img src={picture3} />

我的picture.js

import picture1 from './picture_1.jpg';
import picture2 from './picture_2.jpg';
import picture3 from './picture_3.jpg';

export {
  picture1,
  picture1,
  picture1,
};

理想情况下会想要这样的东西：

import pictures from './picture';

repeat <img src=picture[index]>

Answer 1

您可以使用*导入所有图片。然后使用模板字符串通过索引进行访问。

import * as pictures from './picture';

<img src={pictures[`picture${index}`]}

有没有办法在单个变量下导入多个导出？

1 个答案: