element-ui table头部标题列栏合并

举例

<el-table v-if="selectedLi==1" :data="workLoadList" :span-method="cellSpanMethod" border key="consulting" 
                    style="width: 100%; margin-top: 20px" size="mini" :height='tableHeight' class="workLoad-body-table"
                    v-loading="loading">
                    <el-table-column prop="abbreviationName" label="各地市" width="180" align="center" />
                    <el-table-column prop="amount3" label="引导式法律咨询" align="center">
                        <el-table-column prop="guidanceTotal" label="咨询量" align="center">
                            <template slot="header">
                                <el-tooltip class="item" effect="light" placement="top"
                                    v-on="tootipTemplateToMode('引导-咨询量')">
                                    <div slot="content" v-html="doTemplateToMode.guidanceTotal"></div>
                                    <span>咨询量</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column prop="guidanceReceiveTotal" label="接待量" align="center">
                            <template slot="header">
                                <el-tooltip class="item" effect="light" placement="top"
                                    v-on="tootipTemplateToMode('引导-接待量')">
                                    <div slot="content" v-html="doTemplateToMode.guidanceReceiveTotal"></div>
                                    <span>接待量</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column prop="guidanceReceiveTotalRate" label="接待率" align="center">
                            <template slot="header">
                                <el-tooltip class="item" effect="light" placement="top"
                                    v-on="tootipTemplateToMode('引导-接待率')">
                                    <div slot="content" v-html="doTemplateToMode.guidanceReceiveTotalRate"></div>
                                    <span>接待率</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                        <el-table-column prop="guidanceTotalPercentage" label="占比" align="center">
                            <template slot="header">
                                <el-tooltip class="item" effect="light" placement="top"
                                    v-on="tootipTemplateToMode('引导-占比')">
                                    <div slot="content" v-html="doTemplateToMode.guidanceTotalPercentage"></div>
                                    <span>占比</span>
                                </el-tooltip>
                            </template>
                        </el-table-column>
                    </el-table-column>
                </el-table>

methods: {
	cellSpanMethod({ row, column, rowIndex, columnIndex }) {
              var that = this;
                if (columnIndex == 0) {
                    for (let item in that.mapNameList) {
                        if (row.abbreviationName == item) {
                            if (rowIndex == that.mapNameIndexList[item]) {
                                return {
                                    rowspan: that.mapNameList[item],
                                    colspan: 1,
                                };
                            } else if (rowIndex != that.mapNameIndexList[item]) {
                                return {
                                    rowspan: 0,
                                    colspan: 0,
                                };
                            } else {
                                return {
                                    rowspan: 1,
                                    colspan: 1,
                                };
                            }
                        }
                    }
                } else if (columnIndex == 1) {
                    for (let item in that.mapNameList) {
                        if (row.abbreviationName == item) {
                            if (rowIndex == that.mapNameIndexList[item]) {
                                return {
                                    rowspan: that.mapNameList[item],
                                    colspan: 1,
                                };
                            } else if (rowIndex != that.mapNameIndexList[item]) {
                                return {
                                    rowspan: 0,
                                    colspan: 0,
                                };
                            } else {
                                return {
                                    rowspan: 1,
                                    colspan: 1,
                                };
                            }
                        }
                    }
                } else if (columnIndex == 2) {
                    for (let item in that.mapNameList) {
                        if (row.abbreviationName == item) {
                            if (rowIndex == that.mapNameIndexList[item]) {
                                return {
                                    rowspan: that.mapNameList[item],
                                    colspan: 1,
                                };
                            } else if (rowIndex != that.mapNameIndexList[item]) {
                                return {
                                    rowspan: 0,
                                    colspan: 0,
                                };
                            } else {
                                return {
                                    rowspan: 1,
                                    colspan: 1,
                                };
                            }
                        }
                    }
                }
            },
         }

效果