<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. LeetCode 79.单词搜索 - JavaScript

    题目描述:给定一个二维网格和一个单词,找出该单词是否存在于网格中. 单词必须按照字母顺序,通过相邻的单元格内的字母构成,其中"相邻"单元格是那些水平相邻或垂直相邻的单元格.同一个单 ...

  2. day04-MyBatis的注解开发

    单表的CRUD注解开发: User实体类: package com.zyb.pojo; import java.io.Serializable; import java.util.Date; publ ...

  3. [追热点]学习Rust之选择IDE

    学习语言非常需要实际上手写代码,自然绕不开IDE工具,所以第一时间当然是选择IDE. Rust官网推荐 先去看看Rust官网推荐了什么IDE:工具 - Rust 程序设计语言 无论您喜欢用命令行还是可 ...

  4. 关于java自学的内容及感受

    这周自学了关于java类的知识,进度有点慢,需要抓紧学习剩下的知识,放假后由于自制力差而各种玩没有认认真真的学习,下周要认真的学习之后的进度,争取开学玩全部完成! /** * 动物的类 * */pub ...

  5. P1045麦森数

    P1045麦森数 #include<iostream> #include <cmath> #include <cstring> const int maxn = 1 ...

  6. 十二 INPUT逻辑视图的配置,回显错误信息

    Action接口中提供了五个逻辑视图的名称 SUCCESS ERROR LOGIN INPUT:input在某些拦截器会使用 NONE 配置逻辑视图:struts_demo2.xml,配置后出现错误信 ...

  7. 从零构建以太坊(Ethereum)智能合约到项目实战——第21章 搭建联盟链

    P78 .1-内容介绍 什么情况下建立自己测试用的PoA chain? 公司内网或无对外网络,无法同步区块 降低测试时等待区块的时间 不想碰到testrpc各种雷 PoA chain特点有 有别于Po ...

  8. 吴裕雄--天生自然ORACLE数据库学习笔记:数据导出与导入

    create directory dump_dir as 'd:\dump'; grant read,write on directory dump_dir to scott; --在cmd下 exp ...

  9. 【PAT甲级】1025 PAT Ranking (25 分)(结构体排序,MAP<string,int>映射)

    题意: 输入一个正整数N(N<=100),表示接下来有N组数据.每组数据先输入一个正整数M(M<=300),表示有300名考生,接下来M行每行输入一个考生的ID和分数,ID由13位整数组成 ...

  10. Manthan, Codefest 19 (open for everyone, rated, Div. 1 + Div. 2)D(树状数组)

    //树状数组中数组的特性,有更巧妙的方法.//我们知道在树状数组中,对于数组tree[i],它所维护的区间为[i−lowbit(i)+1,i]//所以对于tree[2^i],它所维护的区间就为[1,2 ...