组件渲染方法、装置、计算机设备、存储介质和程序产品与流程

    专利查询2026-09-02  5


    本申请涉及组件设计,特别是涉及一种组件渲染方法、装置、计算机设备、存储介质和程序产品。


    背景技术:

    1、随着前端开发的日趋复杂,组件化开发便应运而生,目前常使用的前端三大框架,即react、vue和angular,都开发实现了各自框架的组件化系统,这些方案都已经被许多厂商广泛地使用和实践,能够很好地服务于实际的业务。

    2、但是,无论是使用何种框架在对组件进行渲染时都需要通过编写javascript代码进行手动创建渲染,这样效率太低。


    技术实现思路

    1、基于此,有必要针对上述技术问题,提供一种能够提高效率的组件渲染方法、装置、计算机设备、存储介质和程序产品。

    2、第一方面,本申请提供了一种组件渲染方法,该方法包括:

    3、通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;

    4、对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。

    5、在其中一个实施例中,上述方法还包括:

    6、对于未加载的渲染组件,通过模块加载引擎调用加载函数进行组件加载处理,并执行通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件的步骤。

    7、在其中一个实施例中,上述根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果,包括:

    8、根据组件属性对各渲染组件的属性进行过滤处理,得到各渲染组件的目标属性;

    9、将各目标属性分别输入组件构造函数进行渲染处理,得到渲染结果。

    10、在其中一个实施例中,上述对前端页面文档进行扫描处理,得到多个渲染组件,包括:

    11、确定前端页面文档中的待扫描区域;

    12、对待扫描区域进行扫描处理,得到各渲染组件。

    13、在其中一个实施例中,上述对待扫描区域进行扫描处理,得到多个渲染组件,包括:

    14、在待扫描区域包括局部区域的情况下,对局部区域的页面元素进行扫描处理,得到多个渲染组件;

    15、在待扫描区域包括全局区域的情况下,对全局区域的页面元素进行扫描处理,得到各渲染组件。

    16、在其中一个实施例中,上述组件属性的配置过程包括:

    17、获取组件名称;

    18、对组件名称对应各属性的属性值进行配置处理,得到组件属性。

    19、在其中一个实施例中,上述方法还包括:

    20、通过模块加载引擎进行组件定义,得到组件名称和组件方法体;组件方法体用于指示组件的渲染逻辑。

    21、第二方面,本申请还提供了一种组件渲染装置。该装置包括:

    22、组件确定模块,用于通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;

    23、组件渲染模块,用于对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。

    24、第三方面,本申请还提供了一种计算机设备。该计算机设备包括存储器和处理器,存储器存储有计算机程序,处理器执行计算机程序时实现以下步骤:

    25、通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;

    26、对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。

    27、第四方面,本申请还提供了一种计算机可读存储介质。该计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现以下步骤:

    28、通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;

    29、对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。

    30、第五方面,本申请还提供了一种计算机程序产品。该计算机程序产品,包括计算机程序,该计算机程序被处理器执行时实现以下步骤:

    31、通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;

    32、对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。

    33、上述组件渲染方法、装置、计算机设备、存储介质和程序产品,通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。本申请通过预先配置的组件属性和组件构造函数帮助业务实现组件的高效创建和渲染,减少了业务代码开发量,极大的方便了业务对组件的使用,提高了开发效率。



    技术特征:

    1.一种组件渲染方法,其特征在于,所述方法包括:

    2.根据权利要求1所述的方法,其特征在于,所述方法还包括:

    3.根据权利要求1或2所述的方法,其特征在于,所述根据预先配置的组件属性和组件构造函数,对各所述渲染组件进行渲染处理,得到渲染结果,包括:

    4.根据权利要求1所述的方法,其特征在于,所述对所述前端页面文档进行扫描处理,得到多个渲染组件,包括:

    5.根据权利要求4所述的方法,其特征在于,所述对所述待扫描区域进行扫描处理,得到多个渲染组件,包括:

    6.根据权利要求3所述的方法,其特征在于,所述组件属性的配置过程包括:

    7.根据权利要求6所述的方法,其特征在于,所述方法还包括:

    8.一种组件渲染装置,其特征在于,所述装置包括:

    9.一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至7中任一项所述的方法的步骤。

    10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至7中任一项所述的方法的步骤。


    技术总结
    本申请涉及一种组件渲染方法、装置、计算机设备、存储介质和程序产品,通过扫描引擎对前端页面文档进行扫描处理,得到多个渲染组件;对于已加载的渲染组件,根据预先配置的组件属性和组件构造函数,对各渲染组件进行渲染处理,得到渲染结果。本申请通过预先配置的组件属性和组件构造函数帮助业务实现组件的高效创建和渲染,减少了业务代码开发量,极大的方便了业务对组件的使用,提高了开发效率。

    技术研发人员:梁培,赵铭,赵永国,薛煜帅,李丹波,甘开孟,黄生波,孙丽,柯莉莉
    受保护的技术使用者:南方电网数字平台科技(广东)有限公司
    技术研发日:
    技术公布日:2024/11/26
    转载请注明原文地址:https://tc.8miu.com/read-38734.html

    最新回复(0)