如何在React中实现文件的上传和下载功能

在React中实现文件的上传和下载功能可以借助HTML5的File API来实现。以下是一个简单的实现示例：

文件上传功能：

import React, { useState } from 'react';

const FileUpload = () => {
  const [file, setFile] = useState(null);

  const handleFileChange = (e) => {
    setFile(e.target.files[0]);
  };

  const handleUpload = () => {
    // 实现文件上传逻辑
  };

  return (
    <div>
      <input type="file" onChange={handleFileChange} />
      <button onClick={handleUpload}>上传文件</button>
    </div>
  );
};

export default FileUpload;

文件下载功能：

import React from 'react';

const FileDownload = () => {
  const handleDownload = () => {
    // 实现文件下载逻辑
  };

  return (
    <div>
      <button onClick={handleDownload}>下载文件</button>
    </div>
  );
};

export default FileDownload;

在handleUpload和handleDownload中可以实现具体的文件上传和下载逻辑，例如使用fetch API来发送HTTP请求上传或下载文件。另外，也可以使用第三方库来简化文件上传和下载的操作，例如axios库。