vue 表格循环多级表头

cpp 复制代码
<el-table v-loading="loading"  :data="infoList" show-summary>
	<el-table-column v-for="column in columns" :key="column.prop" :label="column.label" :prop="column.prop">
    	<el-table-column v-for="(item,index) in column.list" :key="index" :label="item.label" :prop="item.prop">
        </el-table-column>
    </el-table-column>
</el-table>

数据格式

cpp 复制代码
tableData: [
	{ 
	 institution: '石家庄',
	 entrynum:'111',
	 premium:'201',
     list:[
        {entrynum:'11',premium:'200',}
     ]
    },
],
columns: [
	{ label: '机构', prop: 'institution' },
    { label: '健康险(风险型)',
       list:[
          {label: '项目数', prop: 'entrynum' },
          {label: '保费规模', prop: 'premium' }
       ]
    },
    { label: '健康险(服务型)',
        list:[
          {label: '项目数', prop: 'entrynum' },
          {label: '保费规模', prop: 'premium' }
        ]
     },
     { label: '意外险',
         list:[
            {label: '项目数', prop: 'entrynum' },
            {label: '保费规模', prop: 'premium' }
         ]
     },
     { label: '意健险',
         list:[
           {label: '项目数', prop: 'entrynum' },
           {label: '保费规模', prop: 'premium' }
         ]
     }
],
相关推荐
程序员黑豆5 小时前
Java 注释详解:单行、多行与文档注释的完整指南
java·前端·ai编程
剪刀石头布啊5 小时前
antd中可编辑表格中巧用useWatch实现联动高性能效果,以及定制延伸学习
前端
油丶酸萝卜别吃6 小时前
前端转全栈学习路线
前端·学习
浮生望6 小时前
前端路由进阶:History API原理与手写HistoryRouter
前端
陆枫Larry6 小时前
JavaScript 中的竞态是什么,为啥会有竟态?
前端
上海安当技术8 小时前
半天接入:USBKey RESTful API + C 动态库,Web 和 C/S 两套集成路径实战
前端·后端·restful·集成·usbkey
DevUI团队9 小时前
从“即兴创作”到“规格先行”,华为云码道(CodeArts)代码智能体持续深耕企业级规范驱动开发能力
前端·人工智能·后端
weixin_4316004410 小时前
NestJS 入门(3):Guard 如何挡住未登录请求?
前端·后端·学习·nest.js
avi911110 小时前
[AI教做人]AI平台做2项目;一个3D模型展示,另一个框架多人
javascript·人工智能·ai·3d模型·3d引擎·顶点和法线
kyriewen10 小时前
我用Claude Code两天干完了团队两周的排期——周报发出去那一刻我就后悔了
前端·javascript·ai编程