一种基于组件的页面树状结构处理方法及装置制造方法及图纸

本发明专利技术公开了一种基于组件的页面树状结构处理方法及装置，包括：获取当前输入或移入的组件的目标位置信息和类型属性信息；基于目标位置信息，确定当前输入或移入的组件在页面树状结构中的第一节点位置；响应于检测到当前输入或移入的组件的第一节点位置与页面树状结构中的目标组件的第二节点位置之间属于嵌套位置关系，基于预先设定的至少一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和目标组件的类型属性信息，确定目标组件是否支持嵌套当前输入或移入的组件；以及响应于确定目标组件支持嵌套当前输入或移入的组件，在页面树状结构的第二节点位置处显示当前输入或移入的组件。前输入或移入的组件。前输入或移入的组件。

【技术实现步骤摘要】
一种基于组件的页面树状结构处理方法及装置


[0001]本专利技术涉及信息处理
，并且具体而言，涉及一种基于组件的页面树状结构处理方法及装置、计算机可读存储介质、电子设备以及计算机程序产品。

技术介绍

[0002]基于项目开发的角度，为满足运营和市场的各种活动需求，系统前端开发诸多页面组件，例如海报分享组件、轮播图组件、大图组件、列表展示组件、计时组件、视频组件等组件。系统前端所开发的组件可以让产品、运营或者UI（用户接口）通过在页面上以诸如拖拽组件的类似积木或拼图的方式，实现想要的页面效果。页面中的部分组件支持嵌套方式，例如，在单图组件上支持放置一个或多个按钮组件，在tab栏组件下，支持嵌套各种组件。然而，页面中的另一部分组件只能被放置在页面page下，这些组件不支持任何组件嵌套在下面成为其子组件。例如，按钮组件只能嵌套于页面page、单图组件、定位容器组件等组件下，这是因为按钮组件是最小的组件。在按钮组件下嵌套一个轮播图组件或者视频组件，不管是视觉还是逻辑上，都不符合规则和使用习惯。所以，功能设定不支持按钮组件下嵌套任何组件。
[0003]一般情况下，在对页面进行处理后进行提交时，不管是系统前端验证，还是系统后端验证，均会对页面的数据格式和类型进行判断，以确定是否满足网页保存成功的条件。如果网页保存不成功的话，则提供相应的提示信息，以使得用户能够进行页面的修改。如果用户不熟悉或不了解组件嵌套规则，对不能进行嵌套的组件进行了嵌套拼接，那么在系统前端或系统后端验证后，可能存在多处不满足保存成功的条件。这种情况下，多个提示信息会一并提供给用户，使用户无法分清哪些组件出现嵌套错误，因此给用户体验带来了极大的困扰。

技术实现思路

[0004]鉴于此，本专利技术提出了一种基于组件的页面树状结构处理方法及装置、计算机可读存储介质、电子设备以及计算机程序产品，旨在解决复杂的页面组件嵌套结构中，如何有效地向用户提示组件嵌套规则，降低用户的上手难度且提高用户体验，从而使得用户能够更快更好地生成效果页面。
[0005]根据本公开实施例的一个方面，提供了一种基于组件的页面树状结构处理方法，包括：响应于检测到用于表示页面中组件层级关系的页面树状结构中存在组件输入或组件位置移动，获取当前输入或移入的组件的目标位置信息和类型属性信息；基于所述目标位置信息，确定当前输入或移入的组件在所述页面树状结构中的第一节点位置；响应于检测到当前输入或移入的组件的第一节点位置与所述页面树状结构中的至少一个组件中的目标组件的第二节点位置之间属于嵌套位置关系，基于预先设定的至少
一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定所述目标组件是否支持嵌套当前输入或移入的组件；以及响应于确定所述目标组件支持嵌套当前输入或移入的组件，在所述页面树状结构的第二节点位置处显示所述当前输入或移入的组件。
[0006]优选地，还包括：响应于确定所述目标组件不支持嵌套当前输入或移入的组件，保持所述页面树状结构中的组件位置关系不变并输出用于指示组件嵌套错误的提示信息。
[0007]优选地，其中，所述目标位置信息包括当前输入或移入的组件在所述页面树状结构中的节点位置。
[0008]优选地，还包括：在所述页面树状结构的第二节点位置处显示所述当前输入或移入的组件之后，基于当前输入或移入的组件的类型属性信息，确定当前输入或移入的组件是否支持嵌套其他组件；响应于确定当前输入或移入的组件不支持嵌套其他组件，在所述页面树状结构中使用特定标记对当前输入或移入的组件对应的节点进行标注，以提示当前输入或移入的组件不支持嵌套其他组件。
[0009]优选地，其中，获取当前输入的组件的目标位置信息和类型属性信息，包括：针对组件库中的每个组件，实时检测是否存在与组件输入相关的用户操作；响应于检测到存在与组件输入相关的用户操作，且该用户操作为将组件输入到所述页面树状结构中，基于该用户操作确定当前输入的组件的选定节点位置；基于所述选定节点位置，获取当前输入的组件的目标位置信息；和/或，基于所述组件库的配置文件确定当前输入的组件的类型属性信息。
[0010]优选地，其中，获取当前移入的组件的目标位置信息和类型属性信息，包括：针对所述页面树状结构中的每个组件，实时检测是否存在与组件移动相关的用户操作；响应于检测到存在与组件移动相关的用户操作，且该用户操作为将组件从所述页面树状结构中的一个位置移动到所述页面树状结构中的另一个位置，基于该用户操作确定当前移入的组件的选定节点位置；基于所述选定节点位置，获取当前移入的组件的目标位置信息；和/或，基于所述组件库的配置文件确定当前移入的组件的类型属性信息。
[0011]优选地，其中，基于预先设定的至少一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定所述目标组件是否支持嵌套当前输入或移入的组件，包括：利用所述至少一个嵌套规则判断函数中的每个嵌套规则判断函数，并基于当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定当前输入或移入的组件与所述目标组件之间的嵌套判断结果；响应于每个嵌套规则判断函数的嵌套判断结果均表示支持嵌套，确定所述目标组件支持嵌套当前输入或移入的组件。
[0012]优选地，其中，基于预先设定的至少一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定所述目标组件是否支持嵌套当前输入或移入的组件，包括：基于嵌套数目判断函数，确定所述目标组件嵌套的组件数目是否超出指定的阈值；响应于确定所述目标组件嵌套的组件数目未超出指定的阈值，基于嵌套逻辑判断函数，确定所述目标组件本身是否支持嵌套其他组件；响应于确定所述目标组件本身支持嵌套其他组件，基于嵌套关系判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定当前输入或移入的组件是否是所述目标组件支持的嵌套类型；响应于确定当前输入或移入的组件是所述目标组件支持的嵌套类型，确定所述目标组件支持嵌套当前输入或移入的组件。
[0013]优选地，在所述页面树状结构的第二节点位置处显示所述当前输入或移入的组件之后，还包括：基于所述页面树状结构，生成用于呈现组件的页面；其中所述当前输入或移入的组件在所述页面上的显示位置，是所述页面上与所述页面树状结构的第一节点位置相对应的显示位置。
[0014]根据本公开实施例的一个方面，提供了一种基于组件的页面树状结构处理装置，包括：获取单元，用于响应于检测到用于表示页面中组件层级关系的页面树状结构中存在组件输入或组件位置移动，获取当前输入或移入的组件的目标位置信息和类型属性信息；第一确定单元，用于基于所述目标位置信息，确定当前输入或移入的组件在所述页面树状结构中的第一节点位置；第二确定单元，用于响应于检测到当前输入或移入的组件的第一节点位置与所述页面树状结构中的至少一个组件中的目标组件的第二节点位置之间属于嵌套位置关系，基于预先设定的至少一个嵌套规则判断函数以及当本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于组件的页面树状结构处理方法，包括：响应于检测到用于表示页面中组件层级关系的页面树状结构中存在组件输入或组件位置移动，获取当前输入或移入的组件的目标位置信息和类型属性信息；基于所述目标位置信息，确定当前输入或移入的组件在所述页面树状结构中的第一节点位置；响应于检测到当前输入或移入的组件的第一节点位置与所述页面树状结构中的至少一个组件中的目标组件的第二节点位置之间属于嵌套位置关系，基于预先设定的至少一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定所述目标组件是否支持嵌套当前输入或移入的组件；以及响应于确定所述目标组件支持嵌套当前输入或移入的组件，在所述页面树状结构的第二节点位置处显示所述当前输入或移入的组件。2.根据权利要求1所述的方法，还包括：响应于确定所述目标组件不支持嵌套当前输入或移入的组件，保持所述页面树状结构中的组件位置关系不变并输出用于指示组件嵌套错误的提示信息。3.根据权利要求1所述的方法，其中，所述目标位置信息包括当前输入或移入的组件在所述页面树状结构中的节点位置。4.根据权利要求1所述的方法，还包括：在所述页面树状结构的第二节点位置处显示所述当前输入或移入的组件之后，基于当前输入或移入的组件的类型属性信息，确定当前输入或移入的组件是否支持嵌套其他组件；响应于确定当前输入或移入的组件不支持嵌套其他组件，在所述页面树状结构中使用特定标记对当前输入或移入的组件对应的节点进行标注，以提示当前输入或移入的组件不支持嵌套其他组件。5.根据权利要求1所述的方法，其中，获取当前输入的组件的目标位置信息和类型属性信息，包括：针对组件库中的每个组件，实时检测是否存在与组件输入相关的用户操作；响应于检测到存在与组件输入相关的用户操作，且该用户操作为将组件输入到所述页面树状结构中，基于该用户操作确定当前输入的组件的选定节点位置；基于所述选定节点位置，获取当前输入的组件的目标位置信息；和/或，基于所述组件库的配置文件确定当前输入的组件的类型属性信息。6.根据权利要求1所述的方法，其中，获取当前移入的组件的目标位置信息和类型属性信息，包括：针对所述页面树状结构中的每个组件，实时检测是否存在与组件移动相关的用户操作；响应于检测到存在与组件移动相关的用户操作，且该用户操作为将组件从所述页面树状结构中的一个位置移动到所述页面树状结构中的另一个位置，基于该用户操作确定当前移入的组件的选定节点位置；基于所述选定节点位置，获取当前移入的组件的目标位置信息；
和/或，基于所述组件库的配置文件确定当前移入的组件的类型属性信息。7.根据权利要求1所述的方法，其中，基于预先设定的至少一个嵌套规则判断函数以及当前输入或移入的组件的类型属性信息和所述目标组件的类型属性信息，确定所述目标组件是否支持嵌套当前输入...

【专利技术属性】
技术研发人员：齐雅楠，
申请(专利权)人：北京金堤科技有限公司，
类型：发明
国别省市：