饿了么组件上传图片

最新推荐文章于 2024-05-12 10:20:00 发布

愿祖国繁荣昌盛user

最新推荐文章于 2024-05-12 10:20:00 发布

阅读量1.6k

点赞数 3

文章标签： vue.js javascript html5

本文链接：https://blog.csdn.net/weixin_49875821/article/details/119251442

版权

本文详细介绍了如何利用饿了么UI库的上传组件<el-upload>，配合 formData 和 axios 实现文件上传到后端的过程。通过设置组件属性如`action`、`on-change`等，结合`handleChange`函数处理文件，并通过`append`方法将文件和额外参数添加到formData中，确保文件流和额外信息正确传递给后台。

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

        <el-upload
          class="upload-demo"
          action=""
          :on-change="handleChange"
          :show-file-list="false"
          :on-remove="handleRemove"
          accept=".xls, .xlsx, .jpg, .png, .jpeg"
          style="margin-left: 10px"
          :auto-upload="false">
          <el-button size="small" type="primary">上传附件</el-button>
        </el-upload>

handleChange (_this, file) { // 上传函数
    let params = new FormData()
    params.append('file', file)
    params.append('type', 2)
    PostCheck.handleChange(_this, params)
}


// 通常饿了么自带的参数  file  传给后端就可以  如果后台需要base64 格式的 就把file转一下就好
// append 是向formData里添加数据 参数(后台需要的值)

file 就是要传给后台的文件流

params.append('file', file) 往 formData 对象里添加值

比如要给后台传俩个值一个 file 一个 type 就直接 append 就行

愿祖国繁荣昌盛user

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
饿了么组件上传图片

handleChange (_this, file) { // 上传函数 let params = new FormData() params.append('file', file) params.append('type', 2) PostCheck.handleChange(_this, params)}// 通常饿了么自带的参数 file 传给后端就可以如果后台需要base64 格式的就把file转一下就好// append 是向formData.
复制链接

扫一扫