色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

vue導出excel實例

吉茹定2年前8瀏覽0評論

Excel 是一種流行的文檔格式,常用于數據分析、財務報表、商務報告等領域。在 Vue 中,我們可以通過一些庫來實現將數據導出為 Excel 文件的功能。下面我們來介紹一種常用的 Vue 導出 Excel 文件的方式。

// 引入包
import { export_json_to_excel } from '@/vendor/Export2Excel';
// 導出 Excel 文件的方法:
function exportExcel() {
const sheetHeader = ['姓名', '性別', '年齡', '郵箱'];
const data = [
['Tom', '男', '18', 'tom@mail.com'],
['Jack', '女', '20', 'jack@mail.com'],
['Amy', '女', '16', 'amy@mail.com'],
['Duke', '男', '22', 'duke@mail.com']
];
const fileName = '學生信息表';
const sheetName = 'sheet1';
export_json_to_excel(sheetHeader, data, fileName, sheetName);
}

這里我們使用了一個庫 Export2Excel,可以通過 import 引入它,然后在這個 Vue 方法 exportExcel 中實現導出。首先我們需要定義一個 sheetHeader,用于設置導出 Excel 的表頭。然后我們定義一個 data 數組,其中每個元素代表一行數據。fileName 是 Excel 文件的文件名,sheetName 是 Excel 文件中 sheet 的名字。最后通過 export_json_to_excel 方法實現導出 Excel 文件。

需要注意的是,由于我們直接操作 dom,可能會被瀏覽器攔截,因此我們需要在 chrome 里手動允許下載,或者使用下載框架實現下載的功能。針對不同的瀏覽器,我們需要進行相應的設置。

// Chrome 瀏覽器需要手動允許下載:
chromeOptions: {
prefs: {
download: {
prompt_for_download: false,
directory_upgrade: true,
default_directory: '/tmp'
}
}
}
// 其他瀏覽器可以使用下載框架,例如 js-xlsx
xlsx.writeFile(workbook, `${fileName}.xlsx`);

上述代碼實現了 Chrome 瀏覽器的下載設置,其中 default_directory 是指定下載的文件夾。如果使用下載框架 js-xlsx,我們需要將導出的數據寫入 workbook 中,然后通過 xlsx.writeFile 方法將 workbook 寫入文件并存儲到本地。

總的來說,Vue 導出 Excel 文件的功能是非常常用的,它可以將前端所需的數據導出為 Excel 文件,方便用戶離線查看和使用。當需要導出更復雜的 Excel 表格時,我們可以使用一些其他的庫,例如 xlsx-style。