微信小程序的表格怎么導出成excel？
背景
在學習微信小程序的過程中，需要導出excel文件數據，可是卻沒有后臺服務器，所以只能夠想著使用純前端去導出excel
使用插件：excel-export
導出思想
將數據封裝成excel文件
將excel文件上傳到云存儲中
將云存儲的excel文件以圖片的格式下載到本地
修改圖片文件后綴為xlsx，成為excel文件
操作
將數據封裝成excel文件；將excel文件上傳到云存儲中
建立云函數（我的云函數名稱:uploadexportfile），打開云函數終端，安裝excel-export插件
// 云函數入口文件
const cloud = require('wx-server-sdk')
const nodeExcel = require('excel-export');
const path = require('path');
cloud.init()
// 云函數入口函數
exports.main = async (event, context) => {
var tableMap = {
styleXmlFile:path.join(__dirname,"styles.xml"),
name: Date.now()+"-export",
cols: [],
rows: [],
}
var tableHead = ["編號", "名稱", "生日", "年齡"];
//添加表頭
for(var i=0;i<tableHead.length;i++){
tableMap.cols[tableMap.cols.length]={
caption:tableHead[i],
type:'string'
}
}
//表體：偽數據
const tableList = [
{編號:0,名稱:'張三',生日:'2019-5-1',年齡:20},
{編號:1,名稱:'李四',生日:'2019-5-1',年齡:45}
]
//添加每一行數據
for(var i=0;i<tableList.length;i++){
tableMap.rows[tableMap.rows.length]=[
tableList[i].編號,
tableList[i].名稱,
tableList[i].生日,
tableList[i].年齡
]
}
//保存excelResult到相應位置
var excelResult = nodeExcel.execute(tableMap);
var filePath = "outputExcels";
var fileName = cloud.getWXContext().OPENID + "-" + Date.now()/1000 + '.xlsx';
//圖片上傳到云存儲
return await cloud.uploadFile({
cloudPath: path.join(filePath, fileName),
fileContent: new Buffer(excelResult,'binary')
}).then(res=>{
console.log(res.fileID);
return res;
}).catch(err=>{
});
}
DOWNLOAD
//導出excel
function exportFile(dataHeader,dataList){
wx.showLoading({
title: '正在導出',
});
console.log(dataHeader);
console.log(dataList);
wx.cloud.callFunction({
name:'uploadexportfile',
data:{
dataHeader:dataHeader,
dataList:dataList
}
}).then(res=>{
const fileID = res.result.fileID;
//下載文件
wx.cloud.downloadFile({
fileID: fileID
}).then(res1 => {
this.saveFileToPhotosAlbum(res1);//保存文件到相冊
this.delCloudFile(fileID);//刪除云存儲文件
}).catch(error => {
// handle error
})
}).catch(err1=>{
});
}
//保存文件到本地相冊
function saveFileToPhotosAlbum(res){
//授權
this.writePhotosAlbumAuth();
// 保存文件
var saveTempPath = wx.env.USER_DATA_PATH + "/exportFile"+new Date().getTime()+".jpg";
wx.saveFile({
tempFilePath: res.tempFilePath,
filePath: saveTempPath ,
success:res1=> {
//獲取了相冊的訪問權限，使用 wx.saveImageToPhotosAlbum 將圖片保存到相冊中
wx.saveImageToPhotosAlbum({
filePath: saveTempPath ,
success: res2 => {
//保存成功彈出提示，告知一下用戶
wx.hideLoading();
wx.showModal({
title: '文件已保存到手機相冊',
content: '文件位于tencent/MicroMsg/WeiXin下 \r\n將保存的文件重命名改為[ .xlsx ]后綴即可正常打開',
confirmColor: '#0bc183',
confirmText: '知道了',
showCancel: false
});
},
fail(err2) {
console.log(err2)
}
})
}
});
}
//刪除云存儲文件
function delCloudFile(fileID){
const fileIDs=[];
fileIDs.push(fileID);
//刪除云存儲中的excel文件
wx.cloud.deleteFile({
fileList: fileIDs,
success: res4 => {
// handle success
console.log(res.fileList);
},
fail: console.error
})
}
//上傳單個文件
function uploadSingleFile(cloudPath,filePath){
wx.cloud.uploadFile({
cloudPath: cloudPath, // 上傳至云端的路徑
filePath: filePath, // 小程序臨時文件路徑
success: res => {
// 返回文件 ID
console.log(res.fileID)
},
fail: console.error
})
}
//微信圖片保存到本地相冊授權
function writePhotosAlbumAuth(){
wx.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope:'scope.writePhotosAlbum',
success() {
console.log('授權成功')
}
})
}
}
})
}
module.exports={
uploadSingleFile:uploadSingleFile,
exportFile:exportFile,
saveFileToPhotosAlbum:saveFileToPhotosAlbum,
delCloudFile:delCloudFile,
writePhotosAlbumAuth:writePhotosAlbumAuth
}