Vue Excel庫是Vue.js社區中常用的一個庫,用于生成Excel文件。它可以輕松地將數據導入到Excel中,方便地進行數據分析和處理。
Vue Excel庫的安裝使用非常簡單,可以通過npm進行安裝:
npm install -S vue-excel-export
安裝完成后,我們需要在Vue項目中引入Vue Excel庫:
import VueExcel from 'vue-excel-export' Vue.use(VueExcel)
接下來,我們就可以使用Vue Excel庫進行數據導入了。首先,我們需要準備要導入的數據:
data() { return { tableData: [ { name: '張三', age: 18, score: 90 }, { name: '李四', age: 20, score: 80 } ] } }
然后,我們需要定義一個方法,用于將數據導入Excel中:
methods: { exportExcel() { import('xlsx').then((xlsx) =>{ const sheet = xlsx.utils.json_to_sheet(this.tableData); const workbook = { Sheets: { 'data': sheet }, SheetNames: ['data'] }; const excelBuffer = xlsx.write(workbook, { bookType: 'xlsx', type: 'array' }); this.downloadExcel(excelBuffer, 'data.xlsx') }) }, downloadExcel(buffer, filename) { const blob = new Blob([buffer], { type: 'application/octet-stream' }); if (typeof window.navigator.msSaveBlob !== 'undefined') { window.navigator.msSaveBlob(blob, filename); } else { const URL = window.URL || window.webkitURL; const objectUrl = URL.createObjectURL(blob); const link = document.createElement('a'); link.href = objectUrl; link.download = filename; document.body.appendChild(link); link.click(); setTimeout(() =>{ document.body.removeChild(link); window.URL.revokeObjectURL(objectUrl); }, 200) } } }
最后,在頁面中添加一個按鈕,用于觸發數據導入:
至此,我們就成功地使用了Vue Excel庫來實現數據導入Excel文件的功能。
上一篇c 對象轉化json 串
下一篇python 簡單樣例