眾所周知，uniapp作為跨端利器，有諸多限制，其中之一便是vue頁面不支持傳統網頁的dom、bom、blob等對象。
所以，百度上那些所謂的導入導出excel的方法，大部分都用不了，比如xlsx那個插件，雖然很多方法在vue里不支持，但解析數據等不包含dom那些對象的方法可以考慮下。
插件git:https://github.com/SheetJS/js-xlsx
這類功能也可以交給后台處理，前端直接上傳文件給后台解析入庫，后台直接生成excel文件返回鏈接給前端下載。
話不多說，經過一段時間的摸索，uniapp中，app端導入導出，實現方案如下：
導出Excel，走的是系統IO流，代碼如下：dateUtil.js的代碼點這里
<template>
<view class="content">
<view class="top_box">{{title}}</view>
<view class="btn_cube" @click="tableToExcel">導出一個表來看</view>
<view class="tip">tips：合並什么的可以直接用table標簽相關的行內屬性合並，如colspan、rowspan</view>
<view class="tip">tips：創建目錄時，一個大目錄，下面再有一級年月的目錄，方便到時候讀取目錄</view>
<view class="tip">{{successTip}}</view>
</view>
</template>
<script> import {formatNumber,formatDateThis,getUnixTime} from "@/common/util/dateUtil.js"
var that; export default { components:{ }, data() { return { title:"app端導出excel", successTip:"" } }, onLoad() { that = this; }, methods: { tableToExcel() { //要導出的json數據
const jsonData = [{ name: '測試數據', phone: '123456', email: '123@456.com' } ] //列標題
let worksheet = "sheet1"; let str = '<tr><td>姓名</td><td>電話</td><td>郵箱</td></tr>'; //循環遍歷，每行加入tr標簽，每個單元格加td標簽
for (let i = 0; i < jsonData.length; i++) { str += '<tr>'; for (let item in jsonData[i]) { //增加\t為了不讓表格顯示科學計數法或者其他格式
str += `<td>${ jsonData[i][item] + '\t'}</td>`;
} str += '</tr>'; } //下載的表格模板數據
let 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 encoding="UTF-8"><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>`; //下載模板
exportFile(template); } } } // 導出文件到手機 fileData:要寫入到文件的數據，返回參數為文檔路徑
function exportFile (fileData,documentName="項目Excel文件") { /* PRIVATE_DOC: 應用私有文檔目錄常量 PUBLIC_DOCUMENTS: 程序公用文檔目錄常量 */ plus.io.requestFileSystem(plus.io.PUBLIC_DOCUMENTS, function(fs) { let rootObj = fs.root; let fullPath = rootObj.fullPath; // let reader = rootObj.createReader();
// console.log(reader);
// reader.readEntries((res)=>{
// console.log(res); //這里拿到了該目錄下所有直接文件和目錄
// },(err)=>{console.log(err);})
console.log("開始導出數據********"); // 創建文件夾
rootObj.getDirectory(documentName, { create: true }, function(dirEntry) { //獲取當前的年月繼續創建文件夾
let date = new Date(); let year = date.getFullYear(); let month = date.getMonth() + 1; dirEntry.getDirectory(`${year}年${month}月`,{ create:true },function(dirEntry2){ // 創建文件,防止重名
let fileName = "excel"+getUnixTime(formatDateThis(new Date())); console.log(fileName); dirEntry2.getFile(`${fileName}.xlsx`, { create: true }, function(fileEntry) { fileEntry.createWriter(function(writer) { writer.onwritestart = (e)=>{ uni.showLoading({ title:"正在導出", mask:true }) } // /storage/emulated/0指的就是系統路徑
let pathStr = fullPath.replace("/storage/emulated/0",""); writer.onwrite = (e) => { // 成功導出數據;
uni.hideLoading(); setTimeout(()=>{ uni.showToast({ title:"成功導出", icon:"success" }) that.successTip = `文件位置：${pathStr}/${documentName}/${year}年${month}月`; },500) }; // 寫入內容;
writer.write(fileData); }, function(e) { console.log(e.message); }); }); }) }); }); } </script>
至於導入Excel，我這里就不貼代碼了，思路就是利用uniapp的web-view標簽，相當於是傳統網頁的做法，利用input標簽的file屬性，最后把解析到的值，傳遞回vue頁面。
web-view相關閱讀：https://uniapp.dcloud.io/component/web-view
uni.postMessage({
data: {
excelData: finalData
}
});
tips:手機上不比電腦，如果要調試如上功能，建議下個辦公軟件，比如wps手機版，這樣找excel文件就比較快。