Element-UI 中 el-table 树形数据 tree-props使用避坑 和第一级序号排列

   element官网提示设置tree-props为{children: 'children',hasChildren: 'hasChildren'}，data数据需要设置children和hasChildren属性，row-key也绑定了数据的唯一值变量id，但是树形结构就是出不来

  在el-table中，支持树类型的数据的显示。当 row 中包含 children 字段时，被视为树形数据。渲染树形数据时，必须要指定 row-key。支持子节点数据异步加载。

  设置 Table 的 lazy 属性为 true 与加载函数 load 。通过指定 row 中的 hasChildren 字段来指定哪些行是包含子节点。children 与 hasChildren 都可以通过 tree-props 配置。

  default-expand-all属性表示默认展开，不需要展开可以删除。row-key="id" 和 row里面的属性有children字段(即数据里面需要有children字段) 是必须的，:tree-props="{children: 'children',hasChildren: 'hasChildren'}可有可无。

  如果不是懒加载的话，后端不要设置hasChildren 这个属性，要不然不能树形显示；如果是懒加载，则需要设置hasChildren字段。

序号排列功能

    可以实现翻页序号继续往下排 ,不要使用type="index",否则会导致子项影响父级的序号

        直接上代码

        //获取表格序号
      this.noticeList.forEach((item, index) => {
        item.isIndex = true;
        console.log(this.form.limit ,'this.form.limit ')
        item.parentIndex = (this.form.page - 1) * this.form.limit + index + 1;
      });

效果图