vue+ el-upload+ strapi 上传图片

vue—template———内容，

<el-upload
  class="upload-demo"
  action="http://localhost:1337/upload"
  :headers="headers"
  :http-request="handleUpload"
  :file-list="fileList"
  list-type="picture">
  <el-button size="small" type="primary">点击上传</el-button>
</el-upload>

headers: { 'Content-Type': 'multipart/form-data' },
关于上传的方法，是直接使用element UI提供的 http-request（覆盖默认的上传行为，可以自定义上传的实现）。

js内容

handleUpload(item){
  let formData = new FormData()
  formData.append('files', item.file, item.file.name)
  // console.log('formData---',formData.get('files'))
  axios.post('http://localhost:1337/upload', formData).then(response => {
    this.icon = response.data[0].id
  })
},

注意：formData.append 的第一个参数——要写 files 。
原因：后台报错，显示 Files are empty

将第一个参数修改 为 files 就好了。
直接console.log（formData）是没有东西的，要使用 formData.get('files') 或者getAll()

将图片上传返回的id 挂载到 你想要关联的字段上。 注：后台Icon 的类型要选媒体。
后台配置如下：

因为选择的是，单一媒体，所以，id 直接赋值就好。
如果选择的是多种媒体，就要以数组的形式传值。