基于element-ui的树表排序问题

===========================================

前端代码

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  name: "Task",
  components: {
    
    Treeselect
  },

 <el-table v-loading="loading" :data="taskList" row-key="taskId" border :row-class-name="tableRowClassName"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
      <!-- <el-table-column label="项目ID" align="center" prop="projectId" /> -->
      <!-- <el-table-column label="任务父ID" align="center" prop="parentId" />
      <el-table-column label="父类模板编号" align="center" prop="ancestors" /> -->
      <el-table-column prop="index" width="150" label="序号" align="center">

      </el-table-column>
</el-table>

=================js

  /** 查询任务总表列表 */
    getList() {
      this.loading = true;
      listTask(this.queryParams).then(response => {
        this.taskList = this.handleTree(response.data, "taskId", "parentId");
        this.taskList = this.indexData1(this.taskList)
        this.loading = false;
      });

    },


    // 排序
    indexData1(val) {
      console.log(val)
      val.forEach((item, index) => {
        item.index = index + 1 + '';

        if (item.children.length > 0) {
          this.indexData2(item, item.index);
        }
      });
      return val;
    },
    indexData2(item, oldIndex) {
      if (item.children.length < 0) return;
      if (item.children.length > 0) {
        item.children.forEach((Item, i) => {
          Item.index = oldIndex + '.' + (i + 1);
          this.indexData2(Item, Item.index);
        });
      }
    },
相关推荐
whisperrr.1 小时前
【JavaWeb12】数据交换与异步请求:JSON与Ajax的绝妙搭配是否塑造了Web的交互革命?
前端·ajax·json
烂蜻蜓2 小时前
前端已死?什么是前端
开发语言·前端·javascript·vue.js·uni-app
谢尔登3 小时前
Vue 和 React 的异同点
前端·vue.js·react.js
祈澈菇凉8 小时前
Webpack的基本功能有哪些
前端·javascript·vue.js
小纯洁w8 小时前
Webpack 的 require.context 和 Vite 的 import.meta.glob 的详细介绍和使用
前端·webpack·node.js
想睡好8 小时前
css文本属性
前端·css
qianmoQ8 小时前
第三章:组件开发实战 - 第五节 - Tailwind CSS 响应式导航栏实现
前端·css
zhoupenghui1689 小时前
golang时间相关函数总结
服务器·前端·golang·time
White graces9 小时前
正则表达式效验邮箱格式, 手机号格式, 密码长度
前端·spring boot·spring·正则表达式·java-ee·maven·intellij-idea
庸俗今天不摸鱼9 小时前
Canvas进阶-4、边界检测(流光,鼠标拖尾)
开发语言·前端·javascript·计算机外设