<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. Redis 简易消息队列

    为了保持程序的高效,建议使用ProtoBuf. Google Protocol Buffer( 简称 Protobuf) 是 Google 公司内部的混合语言数据标准,目前已经正在使用的有超过 48, ...

  2. 从数组A中删除在数组B中存在的元素,用C语言实现

    从数组A中删除在数组B中存在的元素,用C语言实现 考验数组操作的能力,C语言的熟练程度. //功能:从数组A中删除在数组B中也存在的数据 //输入:arrA --- 数组A // lenA --- 数 ...

  3. vue element 时间选择器设置禁用日期

    在 el-date-picker 组件中有一个 picker-options 属性 disabledDate 可以设置日期的可选范围 <el-date-picker v-model=" ...

  4. P1135奇怪的电梯

    P1135奇怪的电梯 #include <iostream> #include <cstdio> #include <cstring> #include <a ...

  5. 三 Spring和DI(面试)

      IOC:控制反转,将对象的创建权反转给了Spring DI:依赖注入,前提要有IOC的环境.Spring管理这个类的时候会将类的依赖的属性,在xml注入(设置)进来. 面向对象的时候,类和类之间的 ...

  6. HashMap 原理?jdk1.7 与 1.8区别

    HashMap 结构 以及 1.7 与 1.8 一.区别 01. jdk 1.7 用的是头插法,而jdk1.8以后使用的是尾插法?为什么这样做呢?因为 JDK 1.7 是用单链表进行纵向延伸,采用头插 ...

  7. python字典中值为列表或字典的构造方式

    1.值为列表的构造方法 dic = {} dic.setdefault(key,[]).append(value) >>dic.setdefault('a',[]).append(1) & ...

  8. 【PAT甲级】1035 Password (20 分)

    题意: 输入一个正整数N(<=1000),接着输入N行数据,每行包括一个ID和一个密码,长度不超过10的字符串,如果有歧义字符就将其修改.输出修改过多少组密码并按输入顺序输出ID和修改后的密码, ...

  9. 使用 CocoaPods 遇到的问题记录

    1. 在 Terminal 输入 Cocoapods 命令时,有时会一直等待,出现“Performing a deep fetch of the `master` specs repo to impr ...

  10. SD-WAN基本介绍

    SD-WAN是什么? SD-WAN,即软件定义广域网络,是将SDN技术应用到广域网场景中所形成的一种服务.这种服务用于连接广阔地理范围的企业网络.数据中心.互联网应用及云服务,旨在帮助用户降低广域网的 ...