在前端開發中,我們經常會遇到導出Excel的需求。而在使用Vue框架時,要注意導出的Excel文件亂碼的問題。
Excel文件的編碼格式是使用Windows的代碼頁標記字符的,而不是Unicode編碼。中文的GBK編碼在Windows中對應的代碼頁是CP936。
因此,要處理導出Excel文件亂碼的問題,我們需要將編碼格式從UTF-8轉換成GBK。具體操作方法如下:
1. 在文件頭中添加meta標簽,聲明編碼為GBK。
<head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> </head>
2. 將字符串進行GBK編碼,再進行字符串轉化后返回一個Blob對象。
function exportExcel(){ let data = [ ['姓名', '年齡', '性別'], ['小明', '20', '男'], ['小花', '22', '女'] ] let fileName = 'demo.xls' let sheetName = 'sheet1' let sheetData = '' for(let i = 0; i < data.length; i++){ sheetData += data[i].join('\t') + '\n' } let content = '\ufeff' + sheetData let blob = new Blob([iconv.encode(content, 'gbk')], {type: 'application/vnd.ms-excel'}) let href = URL.createObjectURL(blob) let link = document.createElement('a') link.href = href link.download = fileName document.body.appendChild(link) link.click() document.body.removeChild(link) }
3. 將Blob對象轉換成URL,然后生成一個a標簽并模擬點擊下載。
另外還要注意的是,如果導出的Excel文件中包含中文字符,可以在content字符串前添加'\ufeff',這樣Excel文件打開時就不會出現亂碼了。
綜上所述,在使用Vue框架進行導出Excel文件時,要特別注意編碼格式的問題,將UTF-8編碼轉換為GBK編碼。這樣可以避免導出的Excel文件中出現亂碼,保證數據的準確性和可讀性。