如何在页面上加载一些图像以做出反应

Question

我在 React 页面上显示图像时遇到问题。我有包含 30 张图像的目录，我想在页面（.jsx 文件）上显示它们。我知道我可以导出每一个图像，但我正在寻找更快的方法来执行此操作。你有什么想法可以帮助我吗？:

dir structure:
_|app
_|src
___|images(there are images)
___|components
______|gallery.jsx
_|App.js
_|index.js

我尝试像在普通 html/js 页面中那样使用 insertAdjacentHTML 函数，但我不知道如何转换该代码以在我需要获取 div ID 以插入的地方做出反应带循环的。

Answer 1

如果您使用的是 Create React App，public 文件夹有一个选项。

you put a file into the public folder, it will not be processed by webpack. Instead it will be copied into the build folder untouched. To reference assets in the public folder, you need to use an environment variable called PUBLIC_URL.

https://create-react-app.dev/docs/using-the-public-folder

如何在页面上加载一些图像以做出反应

how to load a few images on page in react

javascript

reactjs

import

export