elupload header

ElUpload 是 CSDN 开发的一个 Vue 组件库中的组件，用于实现文件上传功能。它提供了一些常用的配置项，其中 header 配置项用于设置请求头。通过设置 header，我们可以在上传文件时传递额外的信息给后端服务。

示例代码如下：

<template>
  <el-upload
    action="/upload"
    :headers="uploadHeaders"
    :data="uploadData"
    multiple
    :limit="3"
    :on-exceed="handleExceed"
    :on-remove="handleRemove"
    :on-success="handleSuccess"
    :before-upload="beforeUpload"
  >
    <el-button style="margin-bottom: 20px;" size="small" type="primary">点击上传</el-button>
    <div slot="tip" class="el-upload__tip">只能上传不超过 3MB 的文件</div>
  </el-upload>
</template>

<script>
export default {
  data() {
    return {
      uploadHeaders: {
        Authorization: 'Bearer token',
        'X-Custom-Header': 'value'
      },
      uploadData: {
        userId: '123'
      }
    };
  },
  methods: {
    handleExceed(files, fileList) {
      this.$message.warning(`最多只能上传 ${this.limit} 个文件`);
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handleSuccess(response, file, fileList) {
      console.log(response, file, fileList);
    },
    beforeUpload(file) {
      if (file.size > 3 * 1024 * 1024) {
        this.$message.error('文件大小超过限制');
        return false;
      }
      return true;
    }
  }
};
</script>

在这段示例代码中，我们通过 `:headers` 设置了请求头，其中 `Authorization` 和 `X-Custom-Header` 分别是自定义的请求头字段。在 `uploadData` 中可以设置额外的上传数据，比如 `userId`。

请注意，这只是一个示例代码，实际使用时需要根据具体的后端接口要求来设置请求头的内容。