使用element-ui做表格有一些特殊的表格的時候該怎麼弄呢？案例二
還有一種就是內容部分有合併：
這種情況的話。需要後臺在資料處理上進行配合
<template>
<el-table
border
:span-method="arraySpanMethod"
:data="orgTableData"
>
<el-table-column
prop="shortName"
label="黨組織名稱"
>
</el-table-column>
<el-table-column
prop="fieldName"
label="管理型別"
>
</el-table-column>
<el-table-column
prop="partyOrgSum"
label="黨組織總數"
>
</el-table-column>
<el-table-column
prop="committeeNum"
label="黨委數量">
</el-table-column>
<el-table-column
prop="partyAllOrgNum"
label="黨總支部數量">
</el-table-column>
<el-table-column
prop="partyOrgNum"
label="黨支部數量">
</el-table-column>
<el-table-column
prop="unionPartyOrgNum"
label="聯合黨支部數量">
</el-table-column>
<el-table-column
prop="tempPartyOrgNum"
label="臨時黨支部數量">
</el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
orgTableData: [
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
},
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
},
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
},
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
},
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
},
{
shortName: "案例", //黨組織名稱
fieldName: "25", //管理型別
partyOrgSum: "100", //黨組織總數
committeeNum: "80", //黨委數量
partyAllOrgNum: "120", //黨總支部數量
partyOrgNum: "20", //黨支部數量
unionPartyOrgNum: "10", //聯合黨支部數量
tempPartyOrgNum: "2" //臨時黨支部數量
}
], //下級黨組織資訊統計表
};
},
methods: {
arraySpanMethod({ row, column, rowIndex, columnIndex }) {
//這裡我的小夥伴兒說涉及到了演算法，可能是我太菜了不懂，但是還是讓我弄出來了
//合併單元格方法
if (rowIndex % 2 === 0) {
//判斷條件可以設定成你想合併的行的起始位置
if (columnIndex === 0) {
//判斷條件可以設定成你想合併的列的起始位置
return [2, 1];
}
}
if (rowIndex % 2 === 1) {
//判斷條件可以設定成你想合併的行的起始位置
if (columnIndex === 0) {
//判斷條件可以設定成你想合併的列的起始位置
return [1, 0];
}
}
}
}
};
</script>
<style scoped>
</style>