目錄

下載檔案

方法一

 方法二

方法三

1.程式碼

1.程式碼

1.程式碼

下載檔案

所用的瀏覽器:Google Chrome

方法一

功能：點選匯出按鈕，提交請求，下載excel檔案；

1.跟後端童鞋確認交付的介面的response header設定了

以及返回了檔案流。

2.修改axios請求的responseType為blob，以post請求為例：

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

})
 

3.請求成功，拿到response後，呼叫download函式（建立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()
    }
}
 

 方法二

window.open(url)

1.下載圖片效果圖如下：

2. 下載例如docx文件效果圖如下：

方法三

1.程式碼

window.location.href = url;

判斷上傳檔案型別

1.程式碼

 //判斷上傳檔案型別
                    var filextension = that.formItem.de_enclosure.substring(that.formItem.de_enclosure.lastIndexOf("."), that.formItem.de_enclosure.length);
                    filextension = filextension.toLowerCase();

                    if ((filextension != '.jpg') && (filextension != '.gif') && (filextension != '.jpeg')
                        && (filextension != '.png') && (filextension != '.bmp') && (filextension != '.txt')
                        && (filextension != '.docx') && (filextension != '.zip')) {
                        alert("對不起，系統僅支援jpg,gif,jpeg,png,bmp,docx,txt,zip格式的檔案。");
                        return
                    }
 

獲取上傳檔案大小

1.程式碼

                var size = 0;
                size =files.target.files[0].size;//byte
                size = size / 1024;//kb
                size = (size / 1024).toFixed(3);//mb
                alert('上傳檔案大小為' + size + 'M');

上面程式碼files.target.files[0]是我們獲取到的檔案。toFixed是保留小數，例如如下程式碼：

var num =2.446242342;
num = num.toFixed(2);  // 輸出結果為 2.45