element 怎么把图片上传给后台

最近做一个elment admin管理后台中遇到一个小问题 就是怎样把图片上传给后台

下面我直接附上代码在做详解

         <el-upload style="margin-bottom: 20px;" :action="imgUrl"
                   :limit='1'
                   :multiple='true'
                   list-type="picture-card"
                   :headers="myHeaders"
                   :on-preview="handlePictureCardPreview" :on-remove="handleRemove">
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogUp">
          <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>

 

action后面可以直接跟地址，但是避免接口地址出现页面中于是用了imgUrl来过渡

data 下

imgUrl: window.SITE_CONFIG['baseUrl']+'/upload/file',
myHeaders: {
  token:this.$cookie.get('token')
},

一般需要带token值请求 这样话就能动态获取到token 值 前提是你在登录成功时 存储了token 值

但是提交给后台仍旧报错500，这时与后台小哥哥沟通下 看他那边接受方式是否出错。

因为上传图片header为

headers: { 'Content-Type': 'multipart/form-data' }

 

 

来源：CSDN

作者：新叶之扉之丹儿

链接：https://blog.csdn.net/ZXD1314520/article/details/83308610