vue里将table(可选列)转excel导出的问题

唐伯虎点蚊香
  • 384

一开始使用的通用的一种方案,直接将table的所有列转为excel导出是没问题的,代码如下:

        import FileSaver from 'file-saver'
        import XLSX from 'xlsx'
        
        exportExcel (tableId, fileName) {
            /* generate workbook object from table */
            const table = document.querySelector(`#${tableId}`)
            const fix = document.querySelector('.el-table__fixed');
            let wb;
            if (fix && fix.parentNode == table) {
                wb = XLSX.utils.table_to_book(table.removeChild(fix), { raw: true })
                table.appendChild(fix);
            } else {
                wb = XLSX.utils.table_to_book(table, { raw: true });
            }

            /* get binary string as output */
            const wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })

            try {
                FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), `${fileName}.xlsx`)
            } catch (e) {
                if (typeof console !== 'undefined') console.log(e, wbout)
            }

            return wbout
        }

但是现在有个问题,就是table的某一项是不需要的导出的,比如我们table的最后一列是操作相关的列,比如删除按钮,最后这一列是不需要导出的,怎么在上面的基础上再加入导出时删除某一列的功能呢?大佬们,求教

回复
阅读 485
1 个回答
const table = document.querySelector(`#${tableId}`).cloneNode(true);
// 然后调用 DOM 接口把不需要的列删了
// ... 

还有个更好的方法:渲染一个隐藏的组件,这个组件的表格里不渲染不需要的那一列,然后导出这个组件中的表格就行了。
这个隐藏的组件可以由原来的表格组件修改而来,甚至可以复用。

你知道吗?

宣传栏