<template>
  <div>
    <el-upload
      action="http://localhost:3000/picture"
      :headers="headers"
      list-type="picture-card"
      :on-preview="handlePictureCardPreview"
      :on-remove="handleRemove">
      <i class="el-icon-plus"></i>
    </el-upload>
    <el-dialog :visible.sync="dialogVisible">
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>
 </div>
</template>
<script>
  export default {
    data() {
      return {
        dialogImageUrl: '',
        dialogVisible: false,
        headers:{}
      };
    },
    methods: {
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      }
    },
    created(){
      this.$http.get('/picture')
      this.headers ={Authorization : 'Bearer '+(localStorage.token || '')}
    }
  }
</script>
 
1,在data中创建headers对象
2,element中动态绑定headers
3,   created中赋值

element设置headers添加token的更多相关文章

  1. djangorestframework+vue-cli+axios,为axios添加token作为headers踩坑记

    情况是这样的,项目用的restful规范,后端用的django+djangorestframework,前端用的vue-cli框架+webpack,前端与后端交互用的axios,然后再用户登录之后,a ...

  2. jquery.ajax 跨域请求webapi,设置headers

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 1.第一步 服务端 ...

  3. ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  4. 【转】ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...

  5. jQuery.ajax() 设置 Headers 中的 Accept 内容

    jQuery.ajax() 如何设置 Headers 中的 Accept 内容   其实很简单,首先如果是常见类型,则请直接设置 dataType 属性 $.ajax({ dataType: &quo ...

  6. 交互-通过axios拦截器添加token认证

    通过axios拦截器添加token认证 一.通过axios请求拦截器添加token,保证拥有获取数据的权限 通常访问接口需要相关权限,通常是需要携带token如下所示 那如何在请求头中添加token? ...

  7. discuz 修改亮剑积分商城2.91模板(在常用设置中添加商场首页排序方式的背景颜色)

    在应用 -> 积分商城 -> 常用设置 中添加 商场首页排序方式 的背景颜色修改功能 步骤: 1.找到并打开此页面对应的模板source\plugin\aljsc\template\set ...

  8. python + seleinum +phantomjs 设置headers和proxy代理

    python + seleinum +phantomjs 设置headers和proxy代理     最近因为工作需要使用selenium+phantomjs无头浏览器,其中遇到了一些坑,记录一下,尤 ...

  9. Python爬虫设置Headers

    Python设置Headers import urllib import urllib2 url = 'http://www.server.com/login' user_agent = 'Mozil ...

随机推荐

  1. 8.1.2hadoop Streaming 作业原理和参数设置

    1.1.1         Stream 作业 (1)hadoop streaming Hadoop streaming是hadoop的一个工具,用于运行费java的maper或reducer作业,例 ...

  2. maven设置镜像地址

    方法一:在maven文件夹下的settings.xml中添加(对所有的项目都有效) <mirror> <id>alimaven</id> <name>a ...

  3. December 21st, Week 51st Saturday, 2019

    May the odds be ever in your favor. 愿好运永远眷顾你. From The Hunger Games. May we all have good luck, and ...

  4. 了解Web的相关知识

    一.WWW基础 WWW(world wide web, 万维网)是Internet上基于客户端/服务器体系结构的分布式多平台的超文本超媒体信息服务系统.它利用超文本(hypertext).超媒体(hy ...

  5. redis-key管理

    redis-key管理 1.      redis key 本章主要内容为redis key级别的操作命令. 参考文档:https://redis.io/commands 1.1.    Redis ...

  6. 汇编语言从入门到精通-5微机CPU的指令系统2

    微机CPU的指令系统 5.2.2 标志位操作指令 标志位操作指令是一组对标志位置位.复位.保存和恢复等操作的指令. 1.进位CF操作指令 a.清进位指令CLC(Clear Carry Flag):CF ...

  7. SpringMvc 返回json的三种方式

    参考:https://blog.csdn.net/fupengyao/article/details/62220886

  8. Python学习第十八课——继承,接口继承等

    1.继承:字面意思 # 继承 : 字面意思 class father: pass class grandfather: pass class children(father): # 单继承 pass ...

  9. 从Uber司机只是合同工看,零工经济将受沉重打击?

    Uber自诞生以来,就始终处于漩涡之中--与当地的同类平台斗.创始人出现负面新闻.司机不断抗议--而就在近日"流血上市"后,Uber也没能迎来好时光.反而是股价不断下跌,市值疯狂蒸 ...

  10. 电脑中安装了两个版本的jdk,后装的会把第一个覆盖掉

    电脑中之前装过一个1.8的jdk,后来工作需要又装了个1.7的,但是1.7的没有在系统环境变量中进行配置,而是通过setclasspath文件设置的,但是后来我发现,虽然没有改变系统环境变量中的JAV ...