欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue+axios實現(xiàn)post文件下載

 更新時間：2022年04月27日 09:28:35   作者：yulj  
這篇文章主要為大家詳細介紹了vue+axios實現(xiàn)post文件下載，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實例為大家分享了vue+axios實現(xiàn)post文件下載的具體代碼，供大家參考，具體內容如下

功能：點擊導出按鈕，提交請求，下載excel文件；

這里是axios的post方法。get方法請點擊這里=》here 

第一步：跟后端童鞋確認交付的接口的response header設置了

以及返回了文件流。

第二步：修改axios請求的responseType為blob，以post請求為例：

axios({
 method: 'post',
 url: 'api/user/',
 data: {
 firstName: 'Fred',
 lastName: 'Flintstone'
 },
 responseType: 'blob'
}).then(response => {
 this.download(response)
}).catch((error) => {

})

第三步：請求成功，拿到response后，調用download函數(shù)（創(chuàng)建a標簽，設置download屬性，插入到文檔中并click）

methods: {
 // 下載文件
 download (data) {
 if (!data) {
  return
 }
 let url = window.URL.createObjectURL(new Blob([data]))
 let link = document.createElement('a')
 link.style.display = 'none'
 link.href = url
 link.setAttribute('download', 'excel.xlsx')
 
 document.body.appendChild(link)
 link.click()
 }
}

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

相關文章

  • vue elementUI使用tabs與導航欄聯(lián)動

    vue elementUI使用tabs與導航欄聯(lián)動

    這篇文章主要為大家詳細介紹了vue elementUI使用tabs與導航欄聯(lián)動，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2019-06-06
  • vue.extend與vue.component的區(qū)別和聯(lián)系

    vue.extend與vue.component的區(qū)別和聯(lián)系

    這篇文章主要介紹了vue.extend與vue.component的區(qū)別和聯(lián)系，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值 ,需要的朋友可以參考下
    2018-09-09
  • Vue3之使用js實現(xiàn)動畫示例解析

    Vue3之使用js實現(xiàn)動畫示例解析

    這篇文章主要為大家介紹了Vue3之使用js實現(xiàn)動畫示例解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
    2023-04-04
  • Vue.js雙向綁定實現(xiàn)原理詳解

    Vue.js雙向綁定實現(xiàn)原理詳解

    這篇文章主要為大家詳細介紹了Vue.js雙向綁定實現(xiàn)原理，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2016-12-12
  • Vue常用指令詳解分析

    Vue常用指令詳解分析

    這篇文章給大家詳細分析了關于VUE的常用的相關指令內容，對此有需要的朋友們可以學習下。
    2018-08-08
  • vue+elementUI 實現(xiàn)內容區(qū)域高度自適應的示例

    vue+elementUI 實現(xiàn)內容區(qū)域高度自適應的示例

    這篇文章主要介紹了vue+elementUI 實現(xiàn)內容區(qū)域高度自適應的示例，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下
    2020-09-09
  • 淺析vue中的nextTick

    淺析vue中的nextTick

    這篇文章主要介紹了vue中nextTick的相關資料，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下
    2020-12-12
  • elementUi vue el-radio 監(jiān)聽選中變化的實例代碼

    elementUi vue el-radio 監(jiān)聽選中變化的實例代碼

    這篇文章主要介紹了elementUi vue el-radio 監(jiān)聽選中變化，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下
    2019-06-06
  • Vue.js之$emit用法案例詳解

    Vue.js之$emit用法案例詳解

    這篇文章主要介紹了Vue.js之$emit用法案例詳解,本篇文章通過簡要的案例,講解了該項技術的了解與使用,以下就是詳細內容,需要的朋友可以參考下
    2021-09-09
  • Vue組件實現(xiàn)評論區(qū)功能

    Vue組件實現(xiàn)評論區(qū)功能

    這篇文章主要為大家詳細介紹了Vue組件實現(xiàn)評論區(qū)功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2022-04-04

最新評論