博客

1:将导出文件写在util文件中

const EXCEL = class {
    construct () {}
    /**
     * [exportsCSV 导出数据到CSV]
     * @param  {Array}  [_headers=[]]   [表头]
     * @param  {Array}  [_body=[]]      [内容]
     * @param  {String} [name='excel'}] [文件名]
     */
    exportsCSV (_headers = [], _body = [], name = 'csv') {
        const headers = _headers.join() + '\n'; // 格式化表头
        let body = '';
        _body.forEach(item => { // 格式化表内容
            body += Object.values(item).join() + '\n';
        });
        const output = headers.concat(body); // 合并
        const BOM = '\uFEFF';
        // 创建一个文件CSV文件
        var blob = new Blob([BOM + output], {type: 'text/csv'});
        // IE
        if (navigator.msSaveOrOpenBlob) {
            // 解决大文件下载失败
            // 保存到本地文件
            navigator.msSaveOrOpenBlob(blob, `${name}.csv`);
        } else {
            let downloadLink = document.createElement('a');
            downloadLink.setAttribute('href', URL.createObjectURL(blob)); // 因为url有最大长度限制，encodeURI是会把字符串转化为url，超出限制长度部分数据丢失导致下载失败,为此采用创建Blob（二进制大对象）的方式来存放缓存数据，具体代码如下：
            downloadLink.download = `${name}.csv`;
            document.body.appendChild(downloadLink);
            downloadLink.click();
            document.body.removeChild(downloadLink);
        }
    }
}
export const excel = new EXCEL();

2：引入导出文件import {excel} from ‘../../assets/js/util/export-excel’;

3：页面使用

                orderService.getDownloadOrderDetail(requestObj, this.$root.$data.user.moduleStores.orders, this.$root.$data.user.username).then(res => {
                    var _headers1 = ['订单号','Paid at','出库时间','站点'];
                    var _body1 = [];
                    res.data.forEach(order => {
                        console.log(order,9999)
                        let obj = {
                            '订单号': `${order.order_id}`,
                            '出库时间': `${order.shipping_time ? moment(order.shipping_time).format('YYYY-MM-DD HH:mm:ss') : ''}`,
                            '站点': `${order.store}`,
                        };
                        _body1.push(obj);
                    });
                    this.exportNormal = false;
                    excel.exportsCSV(_headers1,_body1,`${timeRange}订单记录`);
                }).catch(error => {
                    this.exportNormal = false;
                    this.$message({
                        message: '信息获取失败',
                        type: 'error'
                    });
                    this.loading = false;
                });