[发明专利]页面组件生成方法及装置、电子设备和存储介质

说明书

本公开是关于一种页面组件生成方法及装置、电子设备以及计算机可读存储介质，涉及前端开发技术领域，可以应用于开发一套多组控件内容互斥的页面组件的场景。该方法包括：获取初始页面组件，基于初始页面组件确定当前操作控件组与关联控件组；关联控件组与当前操作控件组之间的控件内容互斥；确定关联控件组的关联控件信息；基于关联控件信息对当前操作控件组进行组件编辑操作，以确定更新控件信息；根据更新控件信息对初始页面组件进行组件更新处理，以得到目标页面组件。本公开根据关联控件信息对当前操作控件组进行组件编辑操作，支持组件的动态增删；由于关联控件组与当前操作控件组的控件互斥，可以解决不同控件组之间的互斥选择问题。

技术领域

本公开涉及前端开发技术领域，具体而言，涉及一种页面组件生成方法、页面组件生成装置、电子设备以及计算机可读存储介质。

背景技术

前端开发是创建万维网(World Wide Web，WWW)页面或应用程序(Application，APP)等前端界面呈现给用户的过程，通过各种前端技术、框架、解决方案，来实现互联网产品的用户界面交互。

例如，下拉选择是网络(web)前端页面中常用的控件。超文本标记语言(HyperText Markup Language，HTML)中有select元素，select元素可创建单选或多选菜单。另外，下拉选择控件Treeselect是类似select的选择控件，可选择的数据结构是一个树形结构时，可以使用Treeselect控件，例如公司层级、学科系统、分类目录、省市区地区选择等等。

当前，在某些业务场景中，存在需要对多个页面元素进行相应元素配置的业务需求，且在该页面中同一页面元素不能对应多个配置，例如，在使用Treeselect控件进行页面元素选择时，无法实现内容选择互斥。内容选择互斥是指同一页面元素仅能被一处选中，不能同时多次被选中的情形。例如，在物流运费配置场景中，需要对不同省市地区的运费进行配置，如果在第一运费区间选择了北京市朝阳区，则在第二运费区间将无法再次选择北京市朝阳区。在使用Treeselect控件进行页面元素选择时，无法实现内容选择互斥的效果，即在第一运费区间选择了北京市朝阳区，在第二运费区间还可以再次选择北京市朝阳区，可能导致运费配置发生错误。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种页面组件生成方法、页面组件生成装置、电子设备以及计算机可读存储介质，进而至少在一定程度上克服前端页面的多个选择框之间无法进行内容互斥选择的问题。

本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本发明的实践而习得。

根据本公开的第一方面，提供一种页面组件生成方法，包括：获取初始页面组件，基于初始页面组件确定当前操作控件组与对应的关联控件组；关联控件组与当前操作控件组之间的控件内容互斥；确定关联控件组的关联控件信息；基于关联控件信息对当前操作控件组进行组件编辑操作，以确定更新控件信息；根据更新控件信息对初始页面组件进行组件更新处理，以得到目标页面组件。

在本公开的一种示例性实施方案中，基于初始页面组件确定当前操作控件组与对应的关联控件组，包括：确定初始页面组件对应的页面组件模板；响应于针对页面组件模板的组件添加操作，确定当前操作控件组；获取与当前操作控件组对应的关联控件标识，根据关联控件标识确定关联控件组。

在本公开的一种示例性实施方案中，基于关联控件信息对当前操作控件组进行组件编辑操作，以确定更新控件信息，包括：根据关联控件信息确定初始页面组件的组件显示状态；根据组件显示状态对当前操作控件组进行组件编辑操作，以确定组件更新元素；当前操作控件组与关联控件组之间的选择操作互斥；根据组件更新元素生成更新控件信息。