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.

Routing immediately after a file upload

See original GitHub issue
  • I found a bug

What is the current behavior? Using React Router to route to a new location immediately after uploading a file with react-dropzone. This issue occurs only when browsing the file system to upload, not when using the drag/drop method.

The route is firing before react-dropzone can register that the file system dialog box has closed, which throws an error in the console: Cannot read property 'files' of null

Steps to reproduce.

  1. Set up React Router to change route in the onDrop handler
  2. Browse the file system and select a file to upload (drag/drop method will not throw this error, only browse method)
  3. Observe the route change and error in the console

What is the expected behavior? No error in the console

Workaround Workaround achieved by using a setTimeout() to delay the route change until onFileDialogCancel() can run to completion

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:7

github_iconTop GitHub Comments

1reaction
thoja21commented, Feb 19, 2018

@coopersamuel Thanks, useful to know. Sorry didn’t twig that history.push('/results'); would route - whoops…

0reactions
stale[bot]commented, May 14, 2018

This issue has been automatically marked as stale because it has not had recent activity in the past 60 days. It will be closed if no further activity occurs. If the problem persists please comment here to bump your issue. Thank You - React Dropzone Maintaners

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to Handle File Upload with Node and Express 4.0 | e-Zest
The first, get the method in the router caters to the browser's request to show the page and paints our uploadPage, with upload...
Read more >
Use multer for File-Uploads inside a Express Router
I spent a whole lot of time trying to make this work. var uploadMulter = multer({ dest: directory }); router.post('/upload', uploadMulter.single ...
Read more >
How to Handle File Uploads from Node.js to Express - Twilio
From your text editor, open the index.js file found in the multipart_demo/express_app/routes folder. Delete the contents of the file and replace ...
Read more >
Google Cloud Storage with Node.js: File Upload example
Define Route for uploading file ... When a client sends HTTP requests, we need to determine how the server will response by setting...
Read more >
File uploads using Node.js - CodeForGeek
This project is simple. We will have a simple express web server that does the task of routing and other stuff. Multer will...
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