一 . 修改el-table
在el-table处增加:row-key="getRowID"
<templement>
<el-table id="table"
ref="weighingDataTable"
:data="weighingDataList" force-scroll highlight-current-row
style="width: 100%"
force-scroll="horizontal"
sortable stripe class="el-table__header"
@selection-change="getChangeData"
//或:row-key=id
:row-key="getRowID">
</templement>
<script>
getRowID(row) {
return row.id
},
</script>
二 . 修改el-table-column
//<el-table-column type="selection"> </el-table-column>修改为
<el-table-column type="selection" :reserve-selection='true'> </el-table-column>
三 . 全部前端代码
<template>
<el-table id="table" ref="weighingDataTable" :data="weighingDataList" force-scroll highlight-current-row
style="width: 100%" force-scroll="horizontal" sortable stripe class="el-table__header"
@selection-change="getChangeData" :row-key="getRowID">
<el-table-column type="selection" width="55" :reserve-selection='true'> </el-table-column>
<el-table-column type="index" width="80" label="序号"> </el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
//多选缓存池
tradeSelectedPool: [],
rowSizeCache: 0,
},
methods: {
getRowID(row) {
return row.id
},
//获取选中的数据
getChangeData(rows) {
console.log("选择 rows.length" + rows.length);
this.tradeSelectedPool = rows
console.log("选择 tradeSelectedPool.length" + this.tradeSelectedPool.length);
},
//导出选中数据
exportWeighingData() {
var self = this
axios({
method: 'post',
url: "/tvwpisds/exportWeighingData",
data: {
"grossWeightSum": this.grossWeightSum,
"tareWeightSum": this.tareWeightSum,
"netWeightSum": this.netWeightSum,
"exportData": this.exportData,
"timeCondition": this.timeCondition
},
responseType: 'arraybuffer', //注意这个参数必须加,不然会出现下载好的文件打开是乱码情况
//这个参数是为了告诉axios请求,咱们请求的是二进制数据流
})
.then(res => {
// 假设 data 是返回来的二进制数据
const data = res.data
const url = window.URL.createObjectURL(new Blob([data], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" }))
const link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', self.$route.query.type)
link.download = "称重数据查询导出报表";
//注意:上面的self.$route.query.type是你要下载的文件名加文件后缀,例如test.docx
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
})
},
}
}
</script>