element plus tree 如何展示多个自定义数据

该回答引用GPTᴼᴾᴱᴺᴬᴵ
在 element-plus 的 tree 中，可以使用插槽来展示多个自定义数据，具体实现方式如下：

1.在 中添加 node-key 属性，用于指定每个节点的唯一标识符，例如：

<el-tree :data="data" :node-key="node => node.id">
  ...
</el-tree>

2.在 中添加 slot-scope 属性，用于指定插槽的作用域，例如：

<el-tree :data="data" :node-key="node => node.id" slot-scope="{ node }">
  ...
</el-tree>

3.在 中添加 标签，并在其中定义自定义插槽，例如：

<el-tree :data="data" :node-key="node => node.id" slot-scope="{ node }">
  <template #default="{ node }">
    <span>{{ node.label }}</span>
    <span>{{ node.age }}</span>
    <span>{{ node.sex }}</span>
  </template>
</el-tree>

上述代码中，使用 slot-scope 指定插槽作用域为 { node }，在插槽中使用 {{ node.label }}、{{ node.age }}、{{ node.sex }} 分别展示了 data 中节点的名称、年龄和性别等自定义数据。

需要注意的是，自定义数据需要在数据源中提前定义好，并且在 node 对象中进行绑定才能在插槽中展示。