Search code examples
reactjsmaterial-uireact-dropzone

Passing properties from DropzoneArea to Dropzone

I am using DropzoneArea:

import { DropzoneArea } from 'material-ui-dropzone';

which is based on react-dropzone.

Dropzone from:

import Dropzone from 'react-dropzone'

contains certain props, not exposed by DropzoneArea but available by Dropzone

For instance disabled.

I have several question regarding it: When I create DropzoneArea component, is there a way to mark it as disabled? Is there a way to pass original properties of Dropzone

And here is an original issue I try to solve, probably the solution is not the best one and there are alternatives: When a user uploads a file to DropzoneArea, I can send it to the server via onChange handler. I'd like to disable the whole component, while server is processing a file, until we get a response back.

Solution

  • The DropzoneArea has the property dropzoneProps, which is an object that is being passed (as props) to the Dropzone:

    <DropzoneArea
    dropzoneProps={ { disabled: true} }
    ...
/>