如何在 Vue 3 中推送递归数组？

Posted 2023-03-16

【中文标题】如何在 Vue 3 中推送递归数组？

【英文标题】：How can i push recursive array in Vue 3?

【发布时间】：2022-01-22 02:33:51

【问题描述】：

我必须开发一个具有无限线程的甘特图。如何递归地在子任务中插入子任务？ 提前致谢

<select class="border border-gray-300 rounded-lg" v-model="taskParent">
   <option value="" selected>Select parent</option>
   <option v-for="parent in taskParents" :key="parent.id" :value="parent">
       parent.name
   </option>
</select>


const taskParents = computed(() => 
        return tasks.reduce((curr, task) => 
            curr.push(task)
            task.children.forEach((child) =>  //this foreach is the part to be changed
                curr.push(task)
                )
            return curr
         , []);
    )

【参考方案1】：

你可以使用这个函数来得到一个扁平化的数组表示

function flatten(item)
  const result = [item];
  item.children.forEach(child => 
     result.push(...flatten(child));
  );
  return result;

那就写吧

const taskParents = computed(() => return flatten(task)