uniapp延迟执行_【 vue / uniapp 】延迟加载数据的特殊处理

在用vue实现一个无限层级的树型结构时，遇到了这个问题。

页面结构如图：

其中，父页面的处理逻辑：

步骤一：引用并挂载组件，同时向组件props传递树型JSON列表数据(this.list)，当然这时候的 this.list 还只是一个空数组。

步骤二：在 onload 事件中从服务器获取树型JSON数据并回写到 this.list，同时这个 this.list 也会自动通过 props 传递给组件。

当时考虑到对数据的解耦，不想在父页面中对数据进行过多的处理，拿到服务端的JSON后直接交给组件，剩下的都在组件里实现。

所以对于组件来说，就要对 props 中接收到的数据进一步处理，用来满足树型的相关要求。

首先，为了实现对树型节点的展开/闭合操作，每个节点的数据对象都需要增加一个属性(opened)，用来记忆节点的状态，同时自动渲染到Dom。

组件的处理逻辑：

步骤一：接收 props 中的 list 数据；

步骤二：在组件的 mounted 事件中遍历 list 中当前层级的节点列表数据对象，增加并初始化属性 item.opened = false，即默认闭合节点。

步骤三：如果存在子节点，则递归引用并挂载组件，同时将子节点列表数传递给组件，实现无限层级的树型渲染。

注意：步骤二中为节点数据对象增加 opened 属性需要使用 this.$set 函数，否则新增加的属性将