How to get all the names in dropzone in reactjs

Question

I'm having difficulty on getting all the file name I dropped; I only get the first dropped item name but I needed all the names so i can upload it all. Here is the sample of my dropzone:

onDrop(acceptedFiles) {
    debugger
    console.log('Received files: ', acceptedFiles);
    this.setState({files: acceptedFiles});
    let {form} = this.props.timeline;       

        acceptedFiles.map(file =>  { 
            form.Name=file.name
        });

}

and here is what happens in the dropzone debugged

The problem with your example is that you map through the acceptedFiles and then you assign the form.name again for each item. This will result that your form.Name will always be the same as the last item's name in the acceptedFiles collection. — hequ
– hequ, Commented Jul 4, 2017 at 9:56

hequ · Accepted Answer · 2017-07-04 08:37:30Z

1

Your acceptedFiles already contains all the filenames but the filename is encapsulated inside the object which also seems to contain the TimelineKeyas well.

If you only want the filenames then you need to modify your code a bit:

const filenames = acceptedFiles.map(file => (file.name))

Then you have the collection of filenames and you can do what ever you want with it.

answered Jul 4, 2017 at 8:37

hequ

7816 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

hequ Over a year ago

Yes, it will be a collection of names.

Collectives™ on Stack Overflow

How to get all the names in dropzone in reactjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related