是否可以使用 XHR 上传模式将 Uppy 与拖放一起使用？答案

【问题标题】：Is it possible to use Uppy with Drag and Drop using XHR Upload mode?是否可以使用 XHR 上传模式将 Uppy 与拖放一起使用？
【发布时间】：2020-06-24 15:04:38
【问题描述】：

我正在评估 React 上传框架并偶然发现了 Uppy。

查看文档，我不知道是否可以使用 Drag and Drop 和 XHR Upload 模式使用 Uppy？

有人试过吗？我希望使用现有的hapi 后端。

【问题讨论】：

标签： reactjs hapi uppy

【解决方案1】：

使用 XHR Upload 应该非常简单。目前没有它的例子，但我很确定这是可能的。假设您使用的是功能组件而不是基于类的组件，这里是一些示例代码

import Uppy from '@uppy/core';
import XHRUpload = from '@uppy/xhr-upload';
import { DragDrop } from '@uppy/react';

const MyComponent = () => {
  const uppy = React.useMemo(() => {
    // Do all the configuration here
    return Uppy()
      .use(XHRUpload, {
        endpoint: 'your backend endpoint'
      })
  }, []);

  React.useEffect(() => {
    return () => uppy.close()
  }, [])

  // Other props are also needed, see https://uppy.io/docs/react/drag-drop/
  return <DragDrop uppy={uppy} />
}

这应该可以正常工作。一般来说，不同领域（例如目的地、提供者、框架等）的这些选择中的大多数都可以很好地协同工作，除了少数例外。

我希望这会有所帮助，让我知道这是否有效或是否还有其他问题

【讨论】：