[发明专利]前端原型调试方法及装置

权利要求书

1.一种前端原型调试方法，其特征在于，所述方法包括：

监听并获取用户在一编辑区域内输入的标签信息、动态脚本信息以及层叠样式表信息；

根据设定代码重构规则将所述标签信息、所述动态脚本信息以及所述层叠样式表信息拼接为一渐进式UI组件，并在一预览区域渲染和展示所述渐进式UI组件。

2.根据权利要求1所述的前端原型调试方法，其特征在于，所述根据设定代码重构规则将所述标签信息、所述动态脚本信息以及所述层叠样式表信息拼接为一渐进式UI组件，包括：

通过设定标签将所述层叠样式表信息进行包装，并将经过所述包装后的层叠样式表信息挂载至一初始页面元素节点；

根据所述标签信息和所述动态脚本信息在所述初始页面元素节点上进行渐进式UI组件拼装操作，并将完成所述拼装操作后的渐进式UI组件挂载至一目标页面元素节点。

3.根据权利要求2所述的前端原型调试方法，其特征在于，所述根据所述标签信息和所述动态脚本信息在所述初始页面元素节点上进行渐进式UI组件拼装操作，包括：

在所述初始页面元素节点上通过将所述动态脚本信息转换为对象，并将所述标签信息设定为所述对象的模板属性进行渐进式UI组件拼装操作。

4.根据权利要求1所述的前端原型调试方法，其特征在于，在所述监听并获取用户在一编辑区域内输入的标签信息、动态脚本信息以及层叠样式表信息之前，包括：

在编辑区域内加载预设样例代码并在预览区域渲染和展示与所述样例代码对应的渐进式UI组件。

5.一种前端原型调试装置，其特征在于，包括：

调试编辑模块，用于监听并获取用户在一编辑区域内输入的标签信息、动态脚本信息以及层叠样式表信息；

调试预览模块，用于根据设定代码重构规则将所述标签信息、所述动态脚本信息以及所述层叠样式表信息拼接为一渐进式UI组件，并在一预览区域渲染和展示所述渐进式UI组件。

6.根据权利要求5所述的前端原型调试装置，其特征在于，所述调试预览模块包括：

元素节点挂载单元，用于通过设定标签将所述层叠样式表信息进行包装，并将经过所述包装后的层叠样式表信息挂载至一初始页面元素节点；

组件代码拼接单元，用于根据所述标签信息和所述动态脚本信息在所述初始页面元素节点上进行渐进式UI组件拼装操作，并将完成所述拼装操作后的渐进式UI组件挂载至一目标页面元素节点。

7.根据权利要求6所述的前端原型调试装置，其特征在于，所述组件代码拼接单元包括：

渐进式UI组件拼装子单元，用于在所述初始页面元素节点上通过将所述动态脚本信息转换为对象，并将所述标签信息设定为所述对象的模板属性进行渐进式UI组件拼装操作。

8.根据权利要求5所述的前端原型调试装置，其特征在于，还包括：

默认加载单元，用于在编辑区域内加载预设样例代码并在预览区域渲染和展示与所述样例代码对应的渐进式UI组件。

9.一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现权利要求1至4任一项所述的前端原型调试方法的步骤。

10.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该计算机程序被处理器执行时实现权利要求1至4任一项所述的前端原型调试方法的步骤。