Element ui上传文件upload组件后端code报错406

最新推荐文章于 2024-08-30 16:24:50 发布

robotkirin

最新推荐文章于 2024-08-30 16:24:50 发布

阅读量701

点赞数

文章标签： vue.js elementui

本文链接：https://blog.csdn.net/robotkirin/article/details/122241959

版权

本文介绍了如何使用Element UI的upload组件时，通过http-request属性定制上传行为，解决前端代码报错并处理后端返回的JSON格式响应。实践包括设置FormData，自定义请求API和方法，以确保前后端有效对接。

摘要由CSDN通过智能技术生成

问题描述：用elementui组件upload上传文件，用postman可以跑通，但是在前端代码报错,后端返回响应json格式;

问题解决：用组件这个属性http-request，覆盖默认的上传行为，然后自定义上传的实现，然后自己写一个请求的接口API和方法；

<el-upload
  class="upload-demo"
  drag
  :http-request="fileUpload"
  multiple>
</el-upload>

// 请求的方法 写到vue的methods里
fileUpload(file){
        const parasm = new FormData()
        let files = file.file
        params.append("file",files)
        fileUpload(params).then(res=>{})
}
// request方法需要自己调用
export const fileUpload =function (data){
        return request({
            url:"请求地址"，
            method:"post",
            data
        }).then((res)=?res.data)
}