方法一

1.在vue index.html文件中引入网络资源依赖

    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>
    <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>

2.在对应触发导出事件的标签上添加方法

<button  type="button" id="expor-table" @click="onexport" >导出Excel</button>

3.在vue methods 声明对应的方法

 onexport:function(evt){
            var wb = XLSX.utils.table_to_book(document.getElementById('out-table'));
            var wbout = XLSX.write(wb,{bookType:'xlsx',type:'binary'});
            saveAs(new Blob([this.s2ab(wbout)],{type:'application/octet-stream'}),'sheetjs.xlsx');
        }
        ,s2ab:function(s){
            if(typeof ArrayBuffer !== 'undefined'){
                    var buf = new ArrayBuffer(s.length);
                    var view = new Uint8Array(buf);
                for (var i = 0 ; i!=s.length;++i) view[i] = s.charCodeAt(i) & 0xFF;
                return buf;
            }else{
                var buf = new Array(s.length);
                for (var i = 0 ; i!=s.length;++i) buf[i] = s.charCodeAt(i) & 0xFF;
                return buf;
            }
        }

方法二 改天有时间在写 :嘿嘿

Logo

前往低代码交流专区

更多推荐