View UI （iview）表格合并单元格一行或者多行（行/列合并）

LetMe-886

已于 2022-09-28 15:55:28 修改

阅读量1k

点赞数 1

分类专栏： vue 文章标签： view design 前端 ui

于 2022-09-28 15:51:58 首次发布

本文链接：https://blog.csdn.net/weixin_45734919/article/details/127090487

版权

本文展示了如何在View UI（iview）中进行表格的行或列合并。重点在于强调在合并行时，合并的数据必须相邻，可以通过前端或后端处理使数据排序相邻。提供了相关代码示例，并给出了参考链接。

摘要由CSDN通过智能技术生成

不废话直接上代码

<template>
    <div>
        <Table :columns="columns1" :data="data1" :span-method="handleSpan"></Table>
    </div>
</template>
<script>
export default {
   
    data() {
   
        return {
   
            columns1: [
                {
   
                    title: '类别',
                    key: 'name',
                },
                {
   
                    title: '指标内容',
                    key: 'date',
                },
                {
   
                    title: '性别',
                    key: 'sex'
                },
                {
   
                    title: '信息',
                    key: 'info'
                },
            ],
            //后端返回来的数据，这里是模拟数据
            resData: [
                {
   
                    name: 'John Brown'