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

Question

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

查看文档，我不知道是否可以使用XHR 上传模式将 Uppy 与拖放一起使用？

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

Answer 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} />
}

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

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