递归树形组件展示方法、装置、计算机设备及计算机可读存储介质制造方法及图纸

本发明专利技术公开了一种递归树形组件展示方法、装置、计算机设备及计算机可读存储介质，涉及前端展示技术领域。该方法是先将具有层次结构的递归树形组件转换为扁平数组，然后根据待展示节点数量和内容展示所需高度，确定总体展示所需高度，再然后按照先父后子顺序将各个待展示节点的节点标识自上而下地依次排列在总体展示容器中，再然后根据局部展示容器在所述总体展示容器中的当前所处位置，确定目标待展示节点的节点标识，最后将在扁平数组中的且目标待展示节点的内容信息送入浏览器的可见区域进行渲染展示，由此仅需对当前可见的少量节点的内容信息进行渲染展示，进而可大大加快渲染速度，缩短所需等待时间，保证用户的感知体验。保证用户的感知体验。保证用户的感知体验。

【技术实现步骤摘要】
递归树形组件展示方法、装置、计算机设备及计算机可读存储介质


[0001]本专利技术属于前端展示
，具体涉及一种递归树形组件展示方法、装置、计算机设备及计算机可读存储介质。

技术介绍

[0002]在传统的递归树形组件中，每个节点包含有若干个子节点，使得节点与节点之间的关系是相互嵌套的。这种递归树形组件在数据量较小的场景下进行展示没有任何问题，但是在需要展示大量数据和多层嵌套结构的情况下，传统的递归树形组件展示方案的性能瓶颈将表现为渲染速度特别慢，需要较长时间才能完成渲染。这是因为传统的递归方式需要递归多层节点，嵌套越深，递归次数越多，耗费的时间也会越久。当需要展示全部数据时，所有节点都需要被渲染，因此耗时更长，有的甚至需要直接渲染20多秒。这对于用户而言是无法接受的，因为用户希望能够快速地查看大量和深层次的数据，而不希望等待太久。因此，如何提供一种更加优秀的递归树形组件展示方案，以便保证组件的渲染速度和用户感知体验，是本领域技术人员亟需研究的课题。

技术实现思路

[0003]本专利技术的目的是提供一种递归树形组件展示方法、装本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种递归树形组件展示方法，其特征在于，包括：将具有层次结构的递归树形组件转换为扁平数组，其中，所述扁平数组包含有在所述递归树形组件中的所有节点的内容信息和属性信息，所述属性信息包含有对应节点的节点标识和父节点标识，在所述所有节点中的各个节点的内容展示所需高度相等；根据在所述所有节点中的待展示节点数量和所述内容展示所需高度，确定总体展示所需高度；根据在所述所有节点中的各个待展示节点的属性信息，按照先父后子顺序将所述各个待展示节点的节点标识自上而下地依次排列在总体展示容器中，其中，所述总体展示容器的高度设置为所述总体展示所需高度；根据局部展示容器在所述总体展示容器中的当前所处位置，确定所述局部展示容器的顶部和底部分别以所述总体展示容器的高度基准线为基准的当前相对高度，其中，所述局部展示容器的高度小于所述总体展示容器的高度且为所述内容展示所需高度的正整数倍，所述局部展示容器用于响应用户的人机交互操作结果在所述总体展示容器中纵向移动；根据所述待展示节点数量、所述顶部的当前相对高度和所述内容展示所需高度，确定待展示起始节点的节点标识在所述总体展示容器中的当前自上而下序号，以及根据所述待展示节点数量、所述底部的当前相对高度和所述内容展示所需高度，确定待展示结束节点的节点标识在所述总体展示容器中的当前自上而下序号；根据所述待展示起始节点的节点标识在所述总体展示容器中的当前自上而下序号和所述待展示结束节点的节点标识在所述总体展示容器中的当前自上而下序号，确定在所述总体展示容器中的且自上而下序号位于这两序号之间的至少一个待展示节点的节点标识；根据所述至少一个待展示节点的节点标识，将在所述扁平数组中的所述至少一个待展示节点的内容信息送入浏览器的可见区域进行渲染展示，其中，所述可见区域的高度等于所述局部展示容器的高度，所述可见区域也可响应所述人机交互操作结果在所述浏览器中纵向移动，并与所述局部展示容器一起同步纵向移动。2.根据权利要求1所述的递归树形组件展示方法，其特征在于，将具有层次结构的递归树形组件转换为扁平数组，包括：创建一个为空的数组；遍历在具有层次结构的递归树形组件中的各个节点：先将节点的且在所述递归树形组件中的内容信息添加到所述数组中；然后判断所述节点在所述递归树形组件中是否有父节点，若有，则将所述节点和该父节点分别在所述递归树形组件中的节点标识作为所述节点的属性信息添加到所述数组中，否则将所述节点在所述递归树形组件中的节点标识和为空的父节点标识作为所述节点的属性信息添加到所述数组中，最后在判定所述节点在所述递归树形组件中有子节点时，将该子节点作为待遍历的下一个节点；将最终所得的所述数组作为一个扁平数组，其中，所述扁平数组包含有在所述递归树形组件中的所有节点的内容信息和属性信息，所述属性信息包含有对应节点的节点标识和父节点标识，在所述所有节点中的各个节点的内容展示所需高度相等。3.根据权利要求1所述的递归树形组件展示方法，其特征在于，当所述属性信息还包含有对应节点的展示选择状态标识时，根据在所述所有节点中的待展示节点数量和所述内容展示所需高度，确定总体展示所需高度，包括：
针对在所述所有节点中的各个节点，若对应的展示选择状态标识表示被选中状态或半选中状态，则确定对应节点为待展示节点，其中，所述半选中状态用于指示对应节点的部分后代节点的展示选择状态标识表示被选中状态；根据在所述所有节点中的待展示节点数量和所述内容展示所需高度，确定总体展示所需高度。4.根据权利要求3所述的递归树形组件展示方法，其特征在于，当所述属性信息还包含有对应节点的传承路径时，所述方法还包括：当在所述所有节点中的某个节点的展示选择状态标识表示被选中状态时，将位于所述某个节点的传承路径上的各个祖先节点的展示选择状态标识由未选中状态更新为半选中状态，其中，所述传承路径是指从根节点至父节点的路径，所述根节点是指在所述递归树形组件中没有父节点的节点。5.根据权利要求3所述的递归树形组件展示方法，其特征在于，当所述属性信息还包含有对应节点的传承路径时，所述方法还包括：当在所述所有节点中的某个节点的展示选择状态标识表示被选中状态时，判断所述某个节点在所述递归树形组件中是否有后代节点，若有，则将该后代节点的展示选择状态标识由未选中状态或半选中状态更新为被选中状态，其中，所述后代节点是指在对应的传承路径上...

【专利技术属性】
技术研发人员：刘欣毅，姚舜，
申请(专利权)人：北京洞悉网络有限公司，
类型：发明
国别省市：