el-table tree-prop 的用法

el-table 中的 tree-prop 属性用于实现树形表格的展示，它指定表格数据中表示层级关系的字段名。具体用法如下：

1. 在 el-table 中添加 tree-props 属性，指定表示层级关系的字段名，例如：

<el-table :data="tableData" :tree-props="{children: 'children'}">
  <!-- 表格列定义 -->
</el-table>

上述代码中，我们将表示子节点数组的字段名设置为 'children'。

2. 其中，tableData 表示表格数据，其结构如下：

[
  {
    id: 1,
    name: '节点1',
    children: [
      {
        id: 2,
        name: '子节点1-1'
      },
      {
        id: 3,
        name: '子节点1-2'
      }
    ]
  },
  {
    id: 4,
    name: '节点2',
    children: [
      {
        id: 5,
        name: '子节点2-1',
        children: [
          {
            id: 6,
            name: '孙子节点2-1-1'
          }
        ]
      }
    ]
  }
]

上述代码中，每个节点包含一个 id 和 name 属性，以及一个 children 属性表示其子节点数组。

3. 最后，在 el-table-column 中使用 slot-scope 插槽渲染表格列时，可以通过 $row 属性访问当前行的数据，例如：

<el-table-column label="名称">
  <template slot-scope="{ row }">
    {{ row.name }}
  </template>
</el-table-column>

上述代码中，我们通过 $row.name 访问当前行的 name 属性，并将其渲染为表格列内容。

这样，我们就可以实现树形表格的展示了。