Search code examples
reactjstypescriptreact-dnd

useDrag method of react-dnd , cannot get isDragging in typescript

I am new to react with typescript, I am implementing drag and drop feature using react-dnd package with typescript. following this blog I am trying to drag images but I am facing an issue

Property isDragging does not exist on type unknown

code :

const [{ isDragging }, drag] = useDrag({
        // item denotes the element type, unique identifier (id) and the index (position)
        item: { type, id: image.id, index },
        // collect method is like an event listener, it monitors whether the element is dragged and expose that information
        collect: monitor => ({
          isDragging: monitor.isDragging()
        })
      });

the error I got : - enter image description here

I am confused in the setting type of isDragging or how can I solve this error

Solution

  • Got the answer from react-dnd TSX example

    sandbox url

    const [{ isDragging }, drag] = useDrag({
        type: "image",
        item: () => {
          return { id, index }
        },
        collect: (monitor: any) => ({
          isDragging: monitor.isDragging(),
        }),
      })

    the type is not optional , we need to define type for same