[发明专利]一种模块驱动Web页面渲染方法、系统、终端及存储介质

说明书

本发明提供一种模块驱动Web页面渲染方法、系统、终端及存储介质，包括：根据页面中划分的模块调用后台接口获取数据源；设置数据源中的各个一级字段与各个模块名字保持一一对应关系；遍历所有模块，并根据数据源是否有当前模块的数据来判断是否能够渲染当前模块；根据所述对应关系将数据源中的数据渲染到对应模块中。本发明提出模块驱动的理念，即将被渲染页面拆分为若干个模块，并利用字段建立模块与数据源的对应关系，实现对Web页面的渲染。

技术领域

本发明属于Web开发技术领域，具体涉及一种模块驱动Web页面渲染方法系统、终端及存储介质。

背景技术

随着现代化计算机网站的日益发展，用户对网站信息搜索和浏览阅读的需求逐渐提高，Web前端开发逐渐成了网站制作的重点内容，通过HTML(″超文本标记语言″)、CSS(″层叠样式表″)以及JavaScript(简称″JS″，″脚本语言″)的综合性应用，呈现更加完善的网站操作体验。

传统的前端开发模式的数据渲染方案就是将HTML、JS、CSS融合在一个页面里面，虽然可以快速开发，但这种模式是无规范的。这种无规范的开发模式具备以下几个缺点：耦合度太高，代码之间的关联性太强，不便于后期维护；每个JS文件定义的变量容易造成全局变量冲突；代码编程可读性、可迁移性太差，加大了调试工作的难度。

发明内容

针对现有技术的上述不足，本发明提供一种模块驱动Web页面渲染方法、系统、终端及存储介质，以解决上述技术问题。

第一方面，本发明提供一种模块驱动Web页面渲染方法，包括：

根据页面中划分的模块调用后台接口获取数据源；

设置数据源中的各个一级字段与各个模块名字保持一一对应关系；

遍历所有模块，并根据数据源是否有当前模块的数据来判断是否能够渲染当前模块；

根据所述对应关系将数据源中的数据渲染到对应模块中。

进一步的，所述方法还包括：

为各个模块配置视图、渲染数据并进行初始化；

配置渲染方法，并将所述遍历所有模块，并根据数据源是否有当前模块的数据来判断是否能够渲染当前模块封装在所述渲染方法内。

进一步的，所述方法还包括：

根据所述对应关系，将数据源中的字段赋值给对应模块的渲染数据。

执行所述渲染方法，将渲染数据更新到模块的视图中。

进一步的，所述方法还包括：

对外提供一次性配置接口和数据渲染接口；

将所述配置视图、渲染数据并进行初始化以及配置渲染方法均封装在所述一次性配置接口中；

将所述根据所述对应关系，将数据源中的字段赋值给对应模块的渲染数据以及所述执行所述渲染方法，将渲染数据更新到模块的视图中均封装在所述数据渲染接口中。

进一步的，所述方法还包括：

根据Web页面的功能将页面划分为各个模块，所述模块与页面的视图一一对应，并为模块配置唯一的名字。

进一步的，所述方法还包括：

每个模块配置唯一的渲染方法从而实现不同的Web页面渲染。

进一步的，所述方法还包括：

执行页面刷新操作，通过UI后端模块将视图更新到Web页面。

第二方面，本发明提供一种模块驱动Web页面渲染系统，包括：