如何在PrimeVue FileUpload上传文件后获取API响应数据？

PrimeVue FileUpload组件内置了@upload-success事件，用来捕获上传成功后后端返回的响应数据，你只需给组件绑定该事件即可拿到返回的JSON。

修改后的代码示例：

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

<script setup>
const handleUploadSuccess = (event) => {
    // event.response 即为后端返回的JSON数据
    const responseData = event.response;
    console.log('上传成功，后端返回数据：', responseData);
    // 此处可根据业务需求处理返回的数据
};
</script>

说明 #

回调参数event中的event.response包含了后端返回的完整响应内容，若后端返回的是JSON格式，会自动被解析为JavaScript对象，直接使用即可。如果需要处理上传失败的场景，还可以绑定@upload-error事件来捕获错误响应。

内容的提问来源于stack exchange，提问作者YorS