递归一维嵌套数组以更新父节点

Question

我有一个一维嵌套数组：

nestedObj: [
   { id: 1, parentId: null, taskCode: '12', taskName: 'Parent', duration: 0, assignee: '', crewCount: 0, startDate: null, endDate: null, dependencies: []},
   { id: 2, parentId: 1, taskCode: '12100', taskName: 'Child one', duration: 0, assignee: '', crewCount: 0, startDate: null, endDate: null, dependencies: []},
   { id: 3, parentId: 2, taskCode: '12200', taskName: 'SubChild one', duration: 0, assignee: '', crewCount: 0, startDate: null, endDate: null, dependencies: []},
   { id: 4, parentId: 1, taskCode: '12200', taskName: 'Child two', duration: 0, assignee: '', crewCount: 0, startDate: null, endDate: null, dependencies: []}
]

根据上述数据结构，taskName 的树状图如下所示

-> Parent
        -> Child one
                   -> SubChild one
        -> Child two

这是我的问题：当我更新孩子的startDate 时，其直接父母的startDate 应该更新为最小的startDate（在其所有孩子中），并且这个过程应该传播到根。反之亦然endDate（即）最大startDate（所有子代）。如何使用递归实现这一点？

注意：假设日期为时间戳

提前致谢

Answer 1

您需要的递归函数如下所示：

methods: {
    adjustParent(item) {
      if (!item.parentId) return;   // top-level, exit

      const parent = this.nestedObj.find(o => o.id === item.parentId);
      const children = this.nestedObj.filter(o => o.parentId === item.parentId);

      parent.startDate = Math.min.apply(null, children.map(o => o.startDate));

      this.adjustParent(parent);  // recurse
    }
}

您可以在change 上调用它，例如：

<div v-for="item in nestedObj">
  <input type="text" v-model="item.startDate" @change="adjustParent(item)" />
</div>

Demo