question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

`acceptedFiles` / `rejectedFiles` arrays are not updated when used as function as a child

See original GitHub issue

Do you want to request a feature or report a bug?

  • I found a bug
  • I want to propose a feature

What is the current behavior? Uploading files doesn’t update the acceptedFiles / rejectedFiles arrays when used as function-as-a-child – they stay as empty arrays. This bug can be seen in the docs: Updating styles and contents based on user input

If the current behavior is a bug, please provide the steps to reproduce.

<Dropzone
  accept="image/png"
>
  {({ acceptedFiles, rejectedFiles }) => {
    return acceptedFiles.length || rejectedFiles.length
      ? `Accepted ${acceptedFiles.length}, rejected ${rejectedFiles.length} files`
      : "Try dropping some cool files.";
  }}
</Dropzone>

Verify that dropping / uploading a file does not show the number of accepted or rejected files

What is the expected behavior? acceptedFiles / rejectedFiles arrays should be populated with files accordingly.

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Operating System and react-dropzone version. 5.0.1

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:8
  • Comments:15 (6 by maintainers)

github_iconTop GitHub Comments

3reactions
okonetcommented, Sep 26, 2018

🎉 This issue has been resolved in version 5.1.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

1reaction
kristofferhcommented, Sep 24, 2018

@nfantone Cool. I haven’t had a chance to look into the issue, but if your patch fixes it I’m sure the maintainers would love a PR.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to remove file from react-dropzone? - Stack Overflow
This is my code: function DragFile(props) { const { acceptedFiles, rejectedFiles, getRootProps, getInputProps } = useDropzone ...
Read more >
react-dropzone
The dropzone property getters are just two functions that return objects with properties which you need to use to create the drag 'n'...
Read more >
react-dropzone - npm
Updating styles and contents based on user input. By providing a function that returns the component's children you can not only style ...
Read more >
How to implement drag and drop in React with React DnD
Over 200k developers use LogRocket to create better digital experiences · onDrop function is enclosed in a · useCallback . · acceptedFiles ....
Read more >
You are now entering the React Dropzone - Medium
This will create a new react application in a child directory called ... creates a callback function to be used as a parameter...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found