【JS】json匯出到excel，自定義檔名和字尾名
阿新 • • 發佈：2018-12-15
json匯出excel表格
HTML
<el-button type="danger" class="ml10 fr" @click="exportForm">匯出表格</el-button>
JS
表格輸出的數字，如果太長，會自動計算，解決辦法：
在td上加上樣式 style=“mso-number-format:’\@’”
//匯出表格 exportForm(){ let that = this; let jsonData = []; for(let i in this.tableList){ let tr = { times: this.tableList[i].times, pv: this.tableList[i].pv, uv: this.tableList[i].uv, click: this.tableList[i].click, firstPay: this.tableList[i].firstPay, firstAmount: this.tableList[i].firstAmount, shard: this.tableList[i].shard, }; jsonData.push(tr); console.log(tr) } //列標題 var str = ''; str += '<tr><th>時間</th><th>訪問量(pv)</th><th>訪問人數(uv)</th><th>預購點選量</th><th>已付定金人數</th><th>已收到定金(元)</th><th>分享次數</th></tr>'; //迴圈遍歷，每行加入tr標籤，每個單元格加td標籤 for(let i = 0 ; i < jsonData.length ; i++ ){ str+='<tr>'; for(let item in jsonData[i]){ //增加\t為了不讓表格顯示科學計數法或者其他格式 str+=`<td style="mso-number-format:'\\@'">${ jsonData[i][item] + '\t'}</td>`; } str+='</tr>'; } str += '<tr><td></td></tr>'; str += '<tr><td>總計:</td><td style="mso-number-format:\'\\@\'">'+this.sum.pv+'</td><td style="mso-number-format:\'\\@\'">'+this.sum.uv+'</td><td style="mso-number-format:\'\\@\'">'+this.sum.click+'</td><td style="mso-number-format:\'\\@\'">'+this.sum.firstPay+'</td><td style="mso-number-format:\'\\@\'">'+this.sum.firstAmount+'</td><td style="mso-number-format:\'\\@\'">'+this.sum.shard+'</td></tr>'; var worksheet = 'Sheet1'; //Worksheet名 var uri = 'data:application/vnd.ms-excel;base64,'; //下載的表格模板資料 var template = `<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet> <x:Name>${worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>${str}</table></body></html>`; //下載模板 // window.location.href = uri + this.base64(template) var link = document.createElement("a"); link.href = uri + this.base64(template); link.download = '表格下載' + ".xls"; link.style = "visibility:hidden"; document.body.appendChild(link); link.click(); document.body.removeChild(link); }, base64 (s) { return window.btoa(unescape(encodeURIComponent(s))) },