Javascript 如何在React中导入图像文件夹，使文件中的每个个人图像都可以存储在React状态？

我是一个新的反应者，正在尝试一个实践项目，这将帮助我在图书馆变得更好。现在，我正在尝试获取一个包含10幅图像的文件夹，并将它们导入到我的

App.js

文件中。这是正在呈现到我的HTML文档中的文件。我想做的是导入这些文件（最好是导入某种数组），并使这些数组索引中的每一个都成为存储在状态中的对象中的变量。我将包括我的代码，并尝试进一步解释

下面是我的

App.js

的一部分：

import React, { Component } from 'react';
import './App.css';
import AlbumCard from './AlbumCard/AlbumCard';
import AlbumImages from AlbumImages;

class App extends React.Component {

  state = {
    albumArt: [
      {title: "Supermodel", image: "AlbumImages/1.jpg"},
      {title: "A Moment Apart", image: 'AlbumImages/2.jpg'},
      {title: "Beerbongs and Bentleys", image: 'AlbumImages/3.jpg'},
      {title: "Another Eternity", image: 'AlbumImages/4.jpg'},
      {title: "Astroworld", image: 'AlbumImages/5.jpg'},
      {title: "The Story of Us", image: 'AlbumImages/6.jpg'},
      {title: "Slow Motion", image: 'AlbumImages/7.jpg'},
      {title: "Free Spirit", image: 'AlbumImages/8.jpg'},
      {title: "Birds in the Traps Sing McKnight", image: 'AlbumImages/9.jpg'},
      {title: "At. Long. Last. A$ap", image: 'AlbumImages/10.jpg'}
    ],

      i: 0,
      x: 0,
      y: 0,
      z: 0
  }

---

我想导入文件夹

AlbumImages

，该文件夹由10个图像组成，并将每个图像放入

state.albumArt.image

变量中。有人能帮我解决这个问题吗？任何帮助都将不胜感激。谢谢

可以像这样单独导入每个图像

从./albumages/1.jpg导入图像1；从./AlbumImages/2.jpg导入image2，然后使用image1作为src属性的值，如下所示
。例如，您可以将属性src添加到数组的每个对象。
可以像下面这样单独导入每个图像
从导入图像1。/AlbumImages/1.jpg；从./AlbumImages/2.jpg导入image2，然后使用image1作为src属性的值，如下所示
。例如，您可以将属性src添加到数组的每个对象。
的可能重复项的可能重复项