'DropzoneComponent' does not have any construct or call signatures

[sonydaman]

I am using react typescript getting the following error.

TypeScript error in FileUpload.tsx(99,18):
JSX element type 'DropzoneComponent' does not have any construct or call signatures.  TS2604

  >  99 |                 <DropzoneComponent config={componentConfig}
        |                  ^
    100 |                        eventHandlers={eventHandlers}
    101 |                     djsConfig={djsConfig} />

[binhphan009]

import {DropzoneComponent} from 'react-dropzone-component'

[rogeliotg]

in my case was not following TS interface definition for eventHandlers:DropzoneComponentHandlers, after define type it was clear that the solution is drop nulls or change them by undefined:

var eventHandlers:DropzoneComponentHandlers = { // This one receives the dropzone object as the first parameter // and can be used to additional work with the dropzone.js // object init: undefined, // All of these receive the event as first parameter: drop: undefined, dragstart: undefined, dragend: undefined, dragenter: undefined, dragover: undefined, dragleave: undefined, // All of these receive the file as first parameter: addedfile: undefined, //removedfile: undefined, thumbnail: undefined, error: undefined, processing: undefined, uploadprogress: undefined, sending: undefined, //success: undefined, complete: simpleCallBack, canceled: undefined, maxfilesreached: undefined, maxfilesexceeded: undefined, // All of these receive a list of files as first parameter // and are only called if the uploadMultiple option // in djsConfig is true: processingmultiple: undefined, sendingmultiple: undefined, successmultiple: undefined, completemultiple: undefined, canceledmultiple: undefined, // Special Events totaluploadprogress: undefined, reset: undefined, queuecomplete: undefined, success: undefined, //(file: any) => { // Get server response //const res = JSON.parse(file.xhr.responseText) //let { media } = this.state //media = [...media, res.data] //this.setState({ media }, () => this.props.onUpload(res.data)) //}, removedfile: undefined //(file: any) => { //let { media } = this.state //if (media.length > 0) { // TODO: get current removed media from file // const removedMedia = this.state.media[0] //media = media.filter(m => m.id !== removedMedia.id) //this.setState({ media }, () => this.props.onRemove(removedMedia)) //} //}

}