进行又给table数据导出,以拿到查询的数据,
进行导出时,报这个错,时什么意思
<template>
<div>
<el-button size="small" type="primary" @click="chaxun"
>查询</el-button>
<div class="block">
<span class="demonstration"></span>
<el-date-picker
v-model="datetimeone"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['12:00:00']">
</el-date-picker>
</div>
<el-table id="weektab"
:data="tableData"
style="width:360px"
:header-cell-style="{textAlign: 'center'}"
:cell-style="{ textAlign: 'center' }" >
<el-table-column
prop="username"
width="180px"
label="日期">
</el-table-column>
<el-table-column
prop="password"
width="180px"
label="姓名">
</el-table-column>
</el-table>
<el-button size="small" type="primary" @click="exportExcel"
>导出excel</el-button>
</div>
</template>
<script>
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
const Exceljs=require("exceljs")
export default {
name: "Login",
data() {
return {
tableData: [],
twoon:[],
datetimeone:'',
testTime:{
startTime:'',
endTime:''
}
}
},
methods:{
chaxun() {
if(this.datetimeone.length=='0'){
this.testTime.startTime=undefined;
this.testTime.endTime=undefined;
this.$alert("清输入日期",'提示',{
confirmButtonText:'确定',
type:'warning'
})
}else{
this.testTime.startTime=this.datetimeone[0];
this.testTime.endTime=this.datetimeone[1];
console.log(this.testTime.startTime)
console.log(this.testTime.endTime)
this.$axios.post('http://localhost:8899/api/xun',this.testTime,{headers:{'Content-Type':"application/json"}}).then(
((resp) => {
this.tableData=resp.data; /*回调函数使用箭头函数进行回调 实现vue一个简单的查询 */
})
)
}
},
/*定义导出事件*/
exportExcel(){
/* var xlsxParam={raw:true}
/!*从表生成工作簿对象*!/
var wb=XLSX.utils.table_to_book(
document.querySelector("#weektab"),
xlsxParam
);
/!*获取二级制字符串为输出*!/
var wbout=XLSX.write(wb,{
bookType:'xlsx',
bookSST:true,
type:'array',
});
try {
FileSaver.saveAs(
new Blob([wbout],{type:'application/octet-stream'}),
"sheetjs.xlsx"
);
}catch (e){
if(typeof console!=="nudefined")console.log(e,wbout);
}
return wbout;*/
let valueDate=this.datetimeone;
let examExcels=this.tableData;
const workbook=new Exceljs.Workbook();
workbook.creator='使用情况';
workbook.lastModifiedBy='使用情况';
workbook.created=new Date();
workbook.modified=new Date();
workbook.properties.date1904=true;
const worksheet=workbook.addWorksheet("使用情况");
worksheet.properties.defaultColWidth=16;
worksheet.properties.defaultRowHeight=16;
/*定义第一个表*/
const Examrow=worksheet.getRow(1);
Examrow.height=50;
const Examcell=worksheet.getCell("A1");
worksheet.mergeCells("A1:B1");
Examcell.value='表一';
Examcell.font={name:"宋体",family:4,size:14,bold:true};
Examcell.alignment={vertical:'middle',horizontal:'center'};
worksheet.addTable({
name:"examTable",
ref:'A2',
displayName:'考试计划',
headerRow:true,
filterButton:false,
totalsRow:false,
style:{
theme:'TableStyleLight8',
},
columns:[
{name:'公司'},
{name:'测试'},
],
rows:examExcels,
});
workbook.xlsx.writeBuffer().then((buffer) => {
FileSaver.saveAs(
new Blob([buffer], {
type: "application/octet-stream",
}),
`${valueDate[0]}-${valueDate[1]}使用情况.xlsx`
);
});
}
}
}
</script>
<style scoped>
</style>
应该是tableData的数据格式不对吧
这个是库里的问题 。大概率是数据 不规范 。你可以先用简单的数据测试一下