Getting response from PrimeVue FileUpload after uploading file

Question

I'm currently using PrimeVue FileUpload.

How do I retrieve the response data from my API call after uploading a file using the PrimeVue FileUpload component? My backend API on localhost:8000 successfully returns JSON after the file upload, but I couldn't find any documentation mentioning how to get this response data. Thanks for the help.

Code:

<template>
    <!-- OTHER STUFF HERE -->
    <FileUpload
        ref="fileUploadRef"
        name="sales-order"
        url="http://localhost:8000/api/v1/upload-sales-order/"
        accept=".csv" 
    />
</template>

Answer 1

Take a look at the FileUpload component's emits in the PrimeVue docs. I think that you're looking for the upload emit.

It can be used like this:

    <FileUpload
        @upload="onUpload"
        ref="fileUploadRef"
        name="sales-order"
        url="http://localhost:8000/api/v1/upload-sales-order/"
        accept=".csv" 
    />

And here's how you can access the response data:

    const onUpload = (event) => {
      console.log(event.xhr.response);
    }