上传多张图片并保存到React JS中的数组

在React JS中，我们可以通过以下步骤来上传多张图片并保存到数组中：

首先，我们需要在React项目中引入所需的依赖，包括react-dropzone库和react-image-gallery库。可以使用以下命令进行安装：

npm install react-dropzone react-image-gallery

接下来，在你的React组件中，导入所需的依赖：

import React, { useState } from 'react';
import Dropzone from 'react-dropzone';
import ImageGallery from 'react-image-gallery';

在组件中创建一个用于保存图片的状态数组：

const [images, setImages] = useState([]);

在组件的render方法中，使用Dropzone组件创建一个图片上传区域，并处理上传的图片：

<Dropzone onDrop={handleImageUpload}>
  {({ getRootProps, getInputProps }) => (
    <div {...getRootProps()}>
      <input {...getInputProps()} />
      <p>拖放文件到此区域，或点击上传文件</p>
    </div>
  )}
</Dropzone>

创建一个处理上传图片的函数，该函数将上传的图片添加到图片数组中：

const handleImageUpload = (files) => {
  const uploadedImages = files.map((file) =>
    Object.assign(file, {
      preview: URL.createObjectURL(file)
    })
  );
  setImages(images.concat(uploadedImages));
};