Vue - ElementUI 组件 upload 上传文件时携带 token

最新推荐文章于 2023-06-09 18:17:26 发布

风轻轻~

最新推荐文章于 2023-06-09 18:17:26 发布

阅读量3.5k

点赞数 1

分类专栏： # Vue__组件库文章标签： elementui vue.js

本文链接：https://blog.csdn.net/Jie_1997/article/details/120746816

版权

Vue__组件库专栏收录该内容

13 篇文章 0 订阅

订阅专栏

本文介绍了如何在ElementUI的upload组件中，通过设置headers包含自定义token，实现在上传文件时携带认证信息。步骤包括定义data中的token变量，从本地存储获取token，以及在upload组件中配置headers。

摘要由CSDN通过智能技术生成

ElementUI 组件 upload 上传文件时携带 token

data 中定义 token 参数

data() {
  return {
    token: "",
    fileList: []
},

本地存储中获取 token

mounted() {
  this.token = window.sessionStorage.getItem("token");
},

computed 计算属性中计算 headers

computed: {
  config() {
    return { token: this.token };
  },
},

upload上传组件中配置 headers

<el-upload
  drag
  :action="this.$baseUrl + '/upload/add'"
  :headers="config"
  multiple
  :file-list="fileList"
  :on-success="handleSuccess"
>
  <i class="el-icon-upload"></i>
  <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
</el-upload>