摘要:導出項目簡介插件使用保存文件電子表格解析器安裝使用以示例給定引入插件新增方法錯誤處理方式新增點擊事件瀏覽器會下載問題導出時間格式轉換解決方案
element-ui 導出excel 項目簡介
vue + elementUi
插件使用Project | Description |
---|---|
file-saver | 保存文件 |
xlsx | 電子表格解析器 |
npm install file-saver xlsx --save or yarn add file-saver xlsx使用(以el-table示例)
// table給定id問題// 引入插件 import fileSaver from "file-saver" import xlsx from "xlsx" // methods新增方法 exportTable exportTable(){ let box = xlsx.utils.table_to_book(document.querySelector("#table-data")) let out = xlsx.write(box, { bookType: "xlsx", bookSST: true, type: "array" }) try { fileSaver.saveAs( new Blob([out], { type: "application/octet-stream" }), "sheet.xlsx" ) } catch (e) { // 錯誤處理方式 } return out } // 新增點擊事件(exportTable) 瀏覽器會下載excel
導出時間格式轉換
解決方案:
let xlsxParam = { raw: true };
let wb = xlsx.utils.table_to_book(dom, xlsxParam)
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/99472.html
摘要:上傳組件點擊跳轉到該組件官方文檔用到的組件參數參數說明類型可選默認值必選參數,上傳的地址上傳的文件列表接受上傳的文件類型覆蓋默認的上傳行為最大允許上傳個數文件超出個數限制時的鉤子 1. 上傳 EXCEL Upload組件 點擊跳轉到該組件官方文檔 用到的upload組件參數 參數 說明 類型 可選 默認值 action 必選參數,上傳的地址 string --- --...
摘要:本人第一次寫這個寫的不好還望指出來作為一個由于公司產品的升級然促使我從一個后端人員自學變成前端的開發人員公司做的數據管理系統所以離不開表格了然后表格樣式統一啥的就想到封裝一個里面的了效果圖表格組件的引入與使用監測數據表格 本人第一次寫這個 寫的不好還望指出來作為一個由于公司產品的升級然促使我從一個后端人員自學變成前端的開發人員 !公司做的數據管理系統所以離不開表格了 然后表格樣式統一啥...
摘要:社區的認可目前已經是相關最多的開源項目了,體現出了社區對其的認可。監聽事件手動維護列表這樣我們就簡單的完成了拖拽排序。 完整項目地址:vue-element-admin 系類文章一:手摸手,帶你用vue擼后臺 系列一(基礎篇)系類文章二:手摸手,帶你用vue擼后臺 系列二(登錄權限篇)系類文章三:手摸手,帶你用vue擼后臺 系列三(實戰篇)系類文章四:手摸手,帶你用vue擼后臺 系列...
摘要:社區的認可目前已經是相關最多的開源項目了,體現出了社區對其的認可。監聽事件手動維護列表這樣我們就簡單的完成了拖拽排序。 完整項目地址:vue-element-admin 系類文章一:手摸手,帶你用vue擼后臺 系列一(基礎篇)系類文章二:手摸手,帶你用vue擼后臺 系列二(登錄權限篇)系類文章三:手摸手,帶你用vue擼后臺 系列三(實戰篇)系類文章四:手摸手,帶你用vue擼后臺 系列...
摘要:今天在開發的過程中需要做一個的導出功能。如果需要導出分頁數據這樣的需求是沒法滿足的。需要后臺生成一個文件鏈接,然后點擊下載。 今天在開發的過程中需要做一個Vue的導出功能。老司機開車使用 js-xlsx 里面有vue的部分可以參考廢話不多說了,直接貼代碼 一、在index.html中引用js文件 showImg(https://segmentfault.com/img/bVSsSR?w...
閱讀 1074·2021-11-19 09:40
閱讀 2214·2021-11-15 18:00
閱讀 1267·2021-10-18 13:34
閱讀 2248·2021-09-02 15:40
閱讀 1533·2019-08-30 14:01
閱讀 1113·2019-08-30 11:11
閱讀 2482·2019-08-29 15:26
閱讀 722·2019-08-29 14:15