el-upload http-request用法

el-upload 是 Element UI 中的上传组件，它提供了多种上传方式，其中之一就是通过 http 请求上传文件。

使用 el-upload 的 http-request 属性可以指定上传文件的请求方法和请求地址。具体的用法如下：

<el-upload
  class="upload-demo"
  action="/upload"
  :http-request="uploadFile"
>
  <el-button size="small" type="primary">点击上传</el-button>
</el-upload>

methods: {
  uploadFile(file) {
    // 创建 FormData 对象
    const formData = new FormData();
    // 将文件添加到 FormData 中
    formData.append('file', file);

    // 发起上传文件的请求
    return axios.post('/upload', formData, {
      headers: {
        'Content-Type': 'multipart/form-data'
      }
    }).then(response => {
      // 文件上传成功的处理逻辑
      console.log(response.data);
    }).catch(error => {
      // 文件上传失败的处理逻辑
      console.error(error);
    });
  }
}

在上述代码中，`http-request` 属性绑定了一个名为 `uploadFile` 的方法。当用户选择文件后，会调用该方法来处理文件上传的请求。在 `uploadFile` 方法中，我们创建了一个 `FormData` 对象，将用户选择的文件添加到其中，然后使用 `axios` 发起 POST 请求来上传文件。上传成功后，会执行 `then` 方法中的处理逻辑，上传失败则执行 `catch` 方法中的处理逻辑。

需要注意的是，由于涉及到文件上传，所以请求的 `Content-Type` 需要设置为 `multipart/form-data`，并且需要使用合适的后端接口来处理文件上传的请求。