(vue)获取对象的键遍历,同时循环el-tab页展示key及内容
效果:
数据结构:
"statusData": {"订购广度": [ {"id": 11, "ztName": "广", ... }, {"id": 12, "ztName": "较广", ...}, ],"需求强度": [{"id": 21, "ztName": "强", ...}, {"id": 22, "ztName": "弱", ...}, ],...}
代码:
<el-tabs v-model="activeName" @tab-click="handleClick"><el-tab-pane label="状态查看" name="first"><el-tabs type="border-card">// Object.keys(statusData) 获取对象的键(key): ['订购广度', '需求强度', '动销速度', '市场状态', '贡献度', '异常信息']<el-tab-pane :label="item" v-for="(item,index) in Object.keys(statusData)" :key="index"><el-table:data="statusData[item]"...><el-table-column type="index" label="序号" align="center" />...</el-table></el-tab-pane></el-tabs></el-tab-pane><el-tab-pane label="状态编辑" name="second">...</el-tab-pane>
</el-tabs>