How can i use Uppy DropTarget with React

I’m trying to do some things like that. But doesn’t work.

import React from 'react'
import DropTarget from '@uppy/drop-target'
import { DragDrop, useUppy } from '@uppy/react'

const Dropzone: React.FC = () => {

const uppy = useUppy(() => {
    return new Uppy()
      .use(Tus, {
        endpoint: 'https://tusd.tusdemo.net/files/', // use your tus endpoint here
        retryDelays: [0, 1000, 3000, 5000],
      })
      .use(DropTarget, {
        target: '#dropzone',
      })
})

return (
    <>
      <div
        id="dropzone"
        data-id="dropzone-inner"
        className="flex items-center"
      >
      </div>
    </>
)}

Hey @IIMoJoII and welcome to the forums!

I’m no React expert myself, but to make sure people can properly answer your question it might be an idea to update your question with a few details such as:

  • What are you trying to achieve?
  • What does not work? Do you get any errors?
  • What have you tried yourself so far?