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)
        })
      }
    })

展开前

展开后

相关推荐
TE-茶叶蛋4 小时前
Vue Fragment vs React Fragment
javascript·vue.js·react.js
Angindem4 小时前
从零搭建uniapp项目
前端·vue.js·uni-app
前端小白从0开始6 小时前
Vue3项目实现WPS文件预览和内容回填功能
前端·javascript·vue.js·html5·wps·文档回填·文档在线预览
難釋懷6 小时前
Vue解决开发环境 Ajax 跨域问题
前端·vue.js·ajax
挑战者6668887 小时前
vue入门环境搭建及demo运行
前端·javascript·vue.js
程序猿ZhangSir9 小时前
Vue3 项目的基本架构解读
前端·javascript·vue.js
亲亲小宝宝鸭10 小时前
写了两个小需求,终于搞清楚了表格合并
前端·vue.js
Face10 小时前
路由Vue-router 及 异步组件
前端·javascript·vue.js
风之舞_yjf11 小时前
Vue基础(14)_列表过滤、列表排序
前端·javascript·vue.js
疯狂的沙粒12 小时前
uni-app 项目支持 vue 3.0 详解及版本升级方案?
前端·vue.js·uni-app