天天看點

Vue導出表格資料為Excel

1、安裝插件

(1)npm install xlsx --save

(2)npm install file-saver --save

2、引入插件

import XLSX from ‘xlsx’

import FileSaver from ‘file-saver’

3、給導出資料的按鈕添加一個點選事件

4、在要導出的表格标簽上添加一個id名

5、在methods中處理事件

exporttableinfo(){
        let wb = XLSX.utils.table_to_book(document.querySelector('#out-table'))
        /* get binary string as output */
        let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
        try {
          FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
        } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
        return wbout
      },
           

今天的分享到此結束,歡迎大家互相交流。

繼續閱讀