ElementUI的el-upload组件中设置header

作者:搬砖的石头2024.01.29 19:02浏览量:170

简介:介绍如何在ElementUI的el-upload组件中设置请求头信息,以便在上传文件时携带必要的信息。

在ElementUI的el-upload组件中设置header,可以通过在el-upload组件上添加headers属性来实现。headers属性接受一个对象,对象的键值对表示要设置的请求头信息。
下面是一个简单的示例,演示如何在el-upload组件中设置Content-Type和自定义的X-Custom-Header请求头:

  1. <template>
  2. <el-upload
  3. action="/upload"
  4. :headers="headers"
  5. :on-success="handleSuccess"
  6. :before-upload="beforeUpload"
  7. >
  8. <el-button slot="trigger" type="primary">点击上传</el-button>
  9. </el-upload>
  10. </template>
  11. <script>
  12. export default {
  13. data() {
  14. return {
  15. headers: {
  16. 'Content-Type': 'multipart/form-data',
  17. 'X-Custom-Header': 'Your Custom Value'
  18. },
  19. fileList: []
  20. };
  21. },
  22. methods: {
  23. beforeUpload(file) {\n