el-table树形数据序号排序处理

1,用下面这个代码可以实现基本表格的序号排序

javascript 复制代码
 <el-table-column label="序号" width="50px" align="center">
        <template slot-scope="scope">
                {{ scope.$index + 1 }}
         </template>
  </el-table-column>

2,element ui树形结构的表格,是没有序号排序的,如果还是用上面的代码,序号排序的时候也会把数据的子节点进行序号排序

上面那个肯定不是我们想要的效果,直接上代码,看最终效果

javascript 复制代码
 this.tableData1.forEach((item, index) => {
      item.parentIndex = index + 1;
      if (item.children) {
        item.children.forEach((it, ind) => {
          it.parentIndex = item.parentIndex + "-" + (ind + 1)
        })
      }
    })

展开前

展开后

相关推荐
积水成江3 小时前
关于Generator,async 和 await的介绍
前端·javascript·vue.js
计算机学姐3 小时前
基于SpringBoot+Vue的高校运动会管理系统
java·vue.js·spring boot·后端·mysql·intellij-idea·mybatis
老华带你飞3 小时前
公寓管理系统|SprinBoot+vue夕阳红公寓管理系统(源码+数据库+文档)
java·前端·javascript·数据库·vue.js·spring boot·课程设计
qbbmnnnnnn4 小时前
【WebGis开发 - Cesium】如何确保Cesium场景加载完毕
前端·javascript·vue.js·gis·cesium·webgis·三维可视化开发
杨荧5 小时前
【JAVA开源】基于Vue和SpringBoot的水果购物网站
java·开发语言·vue.js·spring boot·spring cloud·开源
霸王蟹6 小时前
Vue3 项目中为啥不需要根标签了?
前端·javascript·vue.js·笔记·学习
老章学编程i7 小时前
Vue工程化开发
开发语言·前端·javascript·vue.js·前端框架
tanxiaomi8 小时前
vue 不是spa 单页面应用吗? 配置路由工作模式为history 后 ,为什么配置Nginx的 try_files 可以根据url 找到对应的文件?
前端·vue.js·nginx
果子切克now8 小时前
vue3导入本地图片2种实现方法
前端·javascript·vue.js
二十雨辰10 小时前
[uni-app]小兔鲜-06地址+sku+购物车
前端·javascript·vue.js·uni-app