How can I use formdata in upload file on vuetify?

Question

I try like this : https://codepen.io/positivethinking639/pen/OJVRjGL?editors=1010

My code :

<v-form>
  <v-file-input multiple 
                v-model="documents"
                label="File input"></v-file-input>
  <v-btn color="success" @click="submit()">
    test
  </v-btn>
</v-form>

but it does not works

if I upload file and click button test, the formdata empty on the console

How can I solve this problem?

score 1 · Answer 1 · answered Feb 20 '20 at 09:45

1

You can simple use the spread operator to view formdata. FormData is part of the XMLHttpRequest spec.

console.log(...formData);

answered Feb 20 '20 at 09:45

Jeremy Walters

2,081
16
28

score 0 · Answer 2 · answered Feb 20 '20 at 08:28

0

You can't print formData directly on the console.

Try this.

// Display the key/value pairs
for (var pair of formData.entries()) {
    console.log(pair[0]+ ', ' + pair[1]); 
}

Codepen - https://codepen.io/positivethinking639/pen/OJVRjGL?editors=1010

answered Feb 20 '20 at 08:28

Pratik Patel

5,995
1
18
39

I want to ask. What's the difference between sending using formdata and not using formdata? – moses toh Feb 20 '20 at 10:02
formdata used when you want to send the file using Axios – Pratik Patel Feb 20 '20 at 10:11
I send the file using axios – moses toh Feb 20 '20 at 10:13
I get reference that it only to add `headers: {'Content-Type': 'multipart/form-data' }` – moses toh Feb 20 '20 at 10:13
example - https://stackoverflow.com/questions/53784888/quasar-framework-uploader-with-axios – Pratik Patel Feb 20 '20 at 19:40
I use v-file-input (vuetify). Can you give an example using vuetify? – moses toh Feb 20 '20 at 20:06

How can I use formdata in upload file on vuetify?

2 Answers2