最近做一个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' }

 

 

GitHub 加速计划 / eleme / element
15
3
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:4 个月前 )
c345bb45 1 年前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 1 年前
Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐