vue tree 序号

对于Vue中的树形结构，你可以使用一个序号字段来为每个节点分配一个唯一的标识符。这样可以方便地对树进行遍历和操作。下面是一个示例代码，展示了如何为树节点赋予序号：

<template>
  <div>
    <ul>
      <li v-for="node in tree" :key="node.id">
        {{ node.serialNumber }} - {{ node.label }}
        <ul v-if="node.children">
          <tree-node :tree="node.children"></tree-node>
        </ul>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "TreeNode",
  props: {
    tree: {
      type: Array,
      required: true
    }
  },
  computed: {
    serialNumber() {
      return this.tree.findIndex((node) => node === this) + 1;
    }
  }
};
</script>

在上述代码中，我们使用了`serialNumber`计算属性来获取节点在同级节点数组中的索引，并添加1以得到序号。然后我们将序号和节点的标签一起显示在页面上。

请注意，上述代码只是一个简单的示例，实际上你可能需要根据你的数据结构和需求进行相应的修改和扩展。