<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. hutoolJava工具类的使用

    前言 安装 友情开源项目 Hutool相关博客(软文) 捐赠使用公开 核心(Hutool-core) 克隆 支持泛型的克隆接口和克隆类 类型转换 类型转换工具类-Convert 自定义类型转换-Con ...

  2. PAT T1008 Airline Routes

    用tarjan算法缩点~ #include<bits/stdc++.h> using namespace std; ; vector<int> g[maxn]; int N,M ...

  3. 三 Spring和DI(面试)

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

  4. npm安装包时报错:Error: EPERM: operation not permitted, rename

    解决方法:先执行 npm cache clean -force在安装需要的包.

  5. ubuntu修改pip的官方源为豆瓣源

    修改官方源为豆瓣源: 编辑配置文件, 如果没有, 新建一份(我这里没有): mkdir ~/.pipvim ~/.pip/pip.conf 添加内容如下: [global] index-url = h ...

  6. shell脚本中执行shell脚本

    1.a.sh #!/bin/sh name="hello" ./b.sh $name  2.b.sh(这里把b.sh与a.sh放在同一目录下,便于演示) #!/bin/sh ech ...

  7. 超参数 hyperparameters

    转载:https://www.cnblogs.com/qamra/p/8721561.html 超参数的定义:在机器学习的上下文中,超参数是在开始学习过程之前设置值的参数,而不是通过训练得到的参数数据 ...

  8. Python 基础之循环结构 while

    一.while循环介绍 while 循环 可以提高代码的效率,减少代码的冗余 while 条件表达式:    code1    code2如果条件表达式成立,返回Ture,就执行其中的代码块 1.基本 ...

  9. 对Python中列表和数组的赋值,浅拷贝和深拷贝的实例讲解

    引用:https://www.jb51.net/article/142775.htm 列表赋值: 1 2 3 4 5 6 7 >>> a = [1, 2, 3] >>&g ...

  10. Ideone:在线多语言编程执行器工具

    Ideone:在线多语言编程执行器工具此网站提供40种编程语言以上, 能在线直接做编译和执行的动作,该工具是一款简易的编程测试工具,虽然不能替代专业版的工具,但是其功能非常全面. Ideone,一款在 ...