zoukankan      html  css  js  c++  java
  • JavaScript——responseType

    https://www.cnblogs.com/cdemo/p/5225848.html

    https://blog.csdn.net/wkyseo/article/details/78232485

    • 异步请求图片,需要在responseType指定是blob类型
    • 指定接受的类型,res.data 就是Blob 类型,所以不用在var blob = new Blob([res.data])接受
    <template>
      <div class="recImage">
        <div :style="{backgroundImage:'url('+urlData+')'}" class="showImage"></div>
        <span class="btn" @click="recData">异步获取文件</span>
      </div>
    </template>
    <script>
    import axios from "axios";
    export default {
      data() {
        return {
          urlData: ""
        };
      },
      methods: {
        recData() {
          axios({
            method: "post",
            url: "http://127.0.0.1:3000",
            responseType: "blob"
          }).then(res => {
            this.urlData = window.URL.createObjectURL(res.data);
            window.URL.revokeObjectURL(res.data);
          });
        }
      }
    };
    </script>
    <style scoped>
    .recImage {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 150px;
    }
    .recImage .showImage {
       200px;
      height: 200px;
      border: 1px solid #ccc;
    }
    .recImage .btn {
      padding: 5px 10px;
      border: 1px solid #ccc;
      margin-top: 15px;
      cursor: pointer;
    }
    </style>
  • 相关阅读:
    57. Insert Interval
    287. Find the Duplicate Number
    52. N-Queens II
    51. N-Queens
    151. Reverse Words in a String
    29. Divide Two Integers
    [POJ2104]K-th Number
    [JSOI2008]最大数
    [BZOJ3673&3674]可持久化并查集&加强版
    C++ STL rope介绍----可持久化平衡树
  • 原文地址:https://www.cnblogs.com/wuqiuxue/p/9239219.html
Copyright © 2011-2022 走看看