typescript - 无法使用 v-treeview 加载孙节点 - Vuetify

Question

我很难使用 Vuetify 的 v-treeview 加载孙节点。我能够加载子节点。我想要实现的是，每当我点击一个节点（父、子或孙子）时，它应该加载我选择的任何节点。例如，如果我选择父节点，它应该加载子节点，如果我选择子节点，它应该加载孙节点。我的数据库的构建方式是每个内容都有self_id和parent_id。如果内容 self_id 为 1 且 parent_id 为 0，则表示此内容是根/父节点。此外，如果内容 self_id 为 2 且 parent_id 为 1，则每当我加载内容时，此内容将是内容 slef_id 1 的子节点。

我真的需要这方面的帮助，因为我一直在努力寻找一些答案，但我找不到任何我想做的事情。也许，有更好的方法可以做到这一点，如果是这样，请告诉我，我愿意接受任何建议！

这是我的代码：

<v-treeview
   :active.sync="active"
   activatable
   return-object
   :load-children="getChildList"
   :items="contentList" >
</v-treeview>

active: any = [];

contentList: TreeViewType[] = [];

private async mounted() {
    await api.autoGetAllList()
        .then((Response) => {
          this.getContent(Response);
        });
  }
   

  private getContent(Response: any) {
    Response.forEach((item) => {
      if ( item.parent_id === 0) {
        this.contentList.push({
          id: item.id,
          name: item.title,
          children: [],
        });
      }
    });
  }


  private async getChildList(item) {
   await api.getChildNode(item.id)
       .then((Response) => {
         Response.forEach((data) => {
           item.children.push({
             id: data.id,
             name: data.title,
             children: [],
           })
         })
         console.log(Response);
       });
  }

标签： typescriptvuejs2vuetify.js