一种组件渲染方法及装置与流程

文档序号:30962919发布日期:2022-07-30 14:43阅读:61来源:国知局
1.本技术实施例涉及计算机
技术领域
:,尤其涉及一种组件渲染方法及装置。
背景技术
::2.在追踪用户行为与产品内容时,经常会使用到内容追踪平台,以帮助开发人员查询产品信息、定位问题、追踪问题,了解用户或内容的真实情况。例如,内容追踪平台提供贴吧页面和模拟下发页面,分别显示用户发布的帖子内容和模拟用户数据的下发情况。3.在内容追踪平台使用过程中,存在相同的内容分别需要在贴吧页面和模拟下发页面中渲染显示的情况,但是两个不同的页面基于不同的渲染模式进行渲染,需要分别针对不同渲染模式的页面开发逻辑相同但语法不同的代码,导致代码冗余,影响开发效率。技术实现要素:4.本技术实施例提供一种组件渲染方法及装置,以解决现有技术中不同页面基于不同渲染模式进行开发,导致代码冗余,影响开发效率的技术问题,通过提供兼容不同渲染模式的信息显示组件在不同页面进行数据的渲染显示,使代码逻辑更清晰、提高开发效率。5.在第一方面,本技术实施例提供了一种组件渲染方法,包括:6.获取信息页面提供的待显示信息,不同的信息页面基于不同渲染模式渲染显示数据;7.在所述信息页面中加载信息显示组件,并将所述待显示信息传递至所述信息显示组件,由所述信息显示组件对所述待显示信息进行处理确定待展示内容,所述信息显示组件兼容不同信息页面的渲染模式;8.通过所述信息显示组件渲染显示所述待展示内容。9.在第二方面,本技术实施例提供了一种组件渲染装置,包括信息获取模块、信息处理模块和信息显示模块,其中:10.所述信息获取模块,用于获取信息页面提供的待显示信息,不同的信息页面基于不同渲染模式渲染显示数据;11.所述信息处理模块,用于在所述信息页面中加载信息显示组件,并将所述待显示信息传递至所述信息显示组件,由所述信息显示组件对所述待显示信息进行处理确定待展示内容,所述信息显示组件兼容不同信息页面的渲染模式;12.所述信息显示模块,用于通过所述信息显示组件渲染显示所述待展示内容。13.在第三方面,本技术实施例提供了一种组件渲染设备,包括:存储器以及一个或多个处理器;14.所述存储器,用于存储一个或多个程序;15.当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如第一方面所述的组件渲染方法。16.在第四方面,本技术实施例提供了一种存储计算机可执行指令的存储介质,所述计算机可执行指令在由计算机处理器执行时用于执行如第一方面所述的组件渲染方法。17.在第五方面,本技术实施例提供了一种计算机程序产品,该计算机程序产品包括计算机程序,该计算机程序存储在计算机可读存储介质中,设备的至少一个处理器从计算机可读存储介质读取并执行计算机程序,使得设备执行如第一方面所述的组件渲染方法。18.本技术实施例通过在信息页面中加载兼容不同信息页面的渲染模式的信息显示组件,并将信息页面需要显示的待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,并通过信息显示组件渲染显示待展示内容,通过信息显示组件兼容不同信息页的渲染模式,针对信息显示组件进行开发即可,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰、更易维护和复用,有效提高开发效率。附图说明19.图1是本技术实施例提供的一种组件渲染方法的流程图;20.图2是本技术实施例提供的另一种组件渲染方法的流程图;21.图3是本技术实施例提供的一种基于内容追踪平台的组件渲染逻辑示意图;22.图4是本技术实施例提供的一种贴吧页面的显示示意图;23.图5是本技术实施例提供的一种模拟下发页面的显示示意图;24.图6是本技术实施例提供的一种组件渲染装置的结构示意图;25.图7是本技术实施例提供的一种组件渲染设备的结构示意图。具体实施方式26.为了使本技术的目的、技术方案和优点更加清楚,下面结合附图对本技术具体实施例作进一步的详细描述。可以理解的是,此处所描述的具体实施例仅仅用于解释本技术,而非对本技术的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本技术相关的部分而非全部内容。在更加详细地讨论示例性实施例之前应当提到的是,一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作(或步骤)描述成顺序的处理,但是其中的许多操作可以被并行地、并发地或者同时实施。此外,各项操作的顺序可以被重新安排。当其操作完成时上述处理可以被终止,但是还可以具有未包括在附图中的附加步骤。上述处理可以对应于方法、函数、规程、子例程、子程序等等。27.图1给出了本技术实施例提供的一种组件渲染方法的流程图,本技术实施例提供的组件渲染方法可以由组件渲染装置来执行,该组件渲染装置可以通过硬件和/或软件的方式实现,并集成在组件渲染设备中。28.下述以组件渲染装置执行组件渲染方法为例进行描述。参考图1,该组件渲染方法包括:29.s101:获取信息页面提供的待显示信息,不同的信息页面基于不同渲染模式渲染显示数据。30.本实施例提供的多个不同的信息页面基于不同的渲染模式对需要显示的数据进行渲染及显示。例如,渲染模式可以是基于template模版或基于render函数的渲染模式。其中,基于template模版的渲染方式需要写大量v-if条件指令判断需要展示的子组件,在展示子组件之前,还需要对需要显示的数据分字段取值做数据处理,再将处理后的数据传给子组件,业务代码冗余,传值错综复杂。而基于render函数的渲染模式是通过createelement的方式传参创建vnode节点,当子组件传参或子孙节点数量较多时,书写createelement代码会严重降低代码的可读性和维护性。而在不同的信息页面基于不同的渲染模式进行开发时,不同渲染模式无法很好地兼容,只能分开写逻辑完全相同、语法不同的代码,导致代码冗余。本方案将对待显示信息的处理、渲染逻辑聚合到信息显示组件中,在需要显示待显示信息时,在对应信息页面中加载兼容不同渲染模式的信息显示组件,由信息显示组件对待显示信息进行处理以及渲染显示,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰。31.其中,信息页面需要显示的待显示信息可以是文本、视频、音频、图片、交互信息(例如投票信息)等。示例性的,在信息页面需要渲染显示待显示信息时,信息页面可从服务器获取相关的待显示信息,并将待显示信息提供给组件渲染装置进行后续的处理以及渲染。32.s102:在信息页面中加载信息显示组件,并将待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,信息显示组件兼容不同信息页面的渲染模式。33.本实施例提供的信息显示组件(livepostpreview组件)进行数据的渲染时,其对应的渲染模式与本实施例提供的不同的信息页面的渲染数据对应的不同渲染模式兼容。34.示例性的,在信息页面中需要显示待显示信息的位置上加载信息显示组件,并将信息页面提供的待显示信息传递至信息显示组件。信息显示组件配置为在接收到待显示信息时,按照设定的数据处理方式对待显示信息进行处理,确定需要显示的待展示内容。35.在一个可能的实施例中,信息显示组件可根据待显示信息的信息类型对待显示信息进行处理,得到适用于对应信息类型的显示的待展示内容。可选的,可针对不同的信息类型确定不同的数据处理方式,信息显示组件可基于信息类型对应的数据处理方式对待显示信息进行处理,还可以是根据不同的数据处理方式为信息显示组件分别配置不同的数据处理子组件,在需要对待显示信息进行处理时,可将待显示信息传递至对应数据类型的数据处理子组件,由数据处理子组件对待显示信息进行处理得到待展示内容和/或待展示内容的渲染显示处理。36.s103:通过信息显示组件渲染显示待展示内容。37.示例性的,在得到待展示内容后,通过信息显示组件渲染并显示待展示内容。其中,信息显示组件兼容不同信息页面的渲染模式,并且信息显示组件支持在不同的信息页面中引入,对待显示信息的处理及渲染显示逻辑聚合到信息显示组件中,开发人员针对信息显示组件进行开发即可,不需要针对相同的数据处理逻辑开发不同的代码。38.上述,通过在信息页面中加载兼容不同信息页面的渲染模式的信息显示组件,并将信息页面需要显示的待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,并通过信息显示组件渲染显示待展示内容,通过信息显示组件兼容不同信息页的渲染模式,针对信息显示组件进行开发即可,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰、更易维护和复用,有效提高开发效率。39.在上述实施例的基础上,图2给出了本技术实施例提供的另一种组件渲染方法的流程图,该组件渲染方法是对上述组件渲染方法的具体化。参考图2,该组件渲染方法包括:40.s201:获取信息页面提供的待显示信息,不同的信息页面基于不同渲染模式渲染显示数据。41.在一个可能的实施例中,以在内容追踪平台(trace平台)中配置不同的信息页面为例,例如配置的信息页面包括贴吧页面和模拟下发页面,并且贴吧页面和模拟下发页面基于不同的渲染模式进行开发。其中,贴吧页面用于供开发人员查询用户发布的帖子的详细信息,例如输入帖子id(postid)直接查询用户发布的帖子,或者是通过用户id查找用户历史发布的帖子以及帖子id,然后根据帖子id查询用户发布的帖子。模拟下发页面用于供开发人员模拟用户在应用程序接收到的帖子id,并基于帖子id查询用户发布的帖子内容。42.假设内容追踪平台基于vue2.x的前端框架进行搭建,贴吧页面和模拟下发页面作为内容追踪平台的两个信息处理展示模块,存在需要将不同类型的待显示信息(例如长文本、视频、长视频、音频、图片、图片链接、投票等不同类型的待显示信息)展示在同一个ui位置(界面位置)的需求(即在同一个ui位置可显示多种不同类型的待显示信息),并且贴吧页面和模拟下发页面都存在显示待显示信息的需求,即贴吧页面和模拟下发页面都会存在需要处理和显示相同的待显示信息的情况,并且即使是在不同的信息页面,相同的待显示信息的处理和显示逻辑都是一致的。43.其中,贴吧页面基于render函数的渲染模式渲染显示数据,模拟下发页面基于template模板的渲染模式渲染显示数据,贴吧页面通过表格组件(例如ui库的table组件)渲染显示数据,模拟下发页面通过卡片组件(例如是ui库的card组件)渲染显示数据。44.基于render函数的渲染模式需要通过创建元素(createelement)的方式传参创建vnode节点(虚拟节点,virtualnode),当子组件传参或子孙节点数量过多,书写createelement代码会严重降低代码的可读性和维护性,而基于template模板的渲染模式需要通过v-if条件指令判断需要展示的子组件,展示子组件之前,需要分字段取值做数据处理,再将数据传给子组件,业务代码冗余,传值错综复杂。在相关技术中,基于render函数的渲染模式和基于template模板的渲染模式无法很好地兼容,只能分开为贴吧页面和模拟下发页面写两段逻辑完全相同、语法不同的代码,导致代码冗余。本方案通过信息显示组件兼容不同信息页的渲染模式,针对信息显示组件进行开发即可,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰、更易维护和复用,有效提高开发效率。45.示例性的,确定需要显示的待显示信息对应的信息标识(例如帖子id),信息页面基于信息标识向服务器请求获取待显示信息,服务器在接收到信息获取请求后,将基于信息标识向信息页面下发对应的信息标识。获取信息页面(贴吧页面或模拟下发页面)提供的待显示信息,其中,待显示信息包括信息类型和待显示元素数据。信息类型可以是长文本、视频、长视频、音频、图片、图片链接、投票等,信息类型可根据内容追踪平台的内容显示需求进行增加后修改。待显示元素数据的不同字段记录有需要显示的元素的信息(例如长文本、视频、长视频、音频、图片、图片链接、投票),以视频为例,对视频进行显示需要对应的视频链接和视频封面,对应的,待显示信息的信息类型为视频时,待显示元素数据记录有videourl视频链接字段和videocover视频封面字段,可根据videourl视频链接播放对应的视频,并且可根据videocover视频封面字段可显示视频封面。46.s202:根据待显示元素数据在信息页面上的显示位置,在显示位置中加载信息显示组件。47.示例性的,确定待显示元素数据需要在信息页面上进行显示的显示位置,并在显示位置上加载用于处理待显示元素数据的信息显示组件。在一个可能的实施例中,信息页面包括贴吧页面和模拟下发页面,对于贴吧页面,其展示信息的载体是ui库的表格组件,对应的,信息显示组件的加载位置为贴吧页面的表格组件上设定用于显示待显示元素数据的位置。对于下发模拟页面,其展示信息的载体是ui库的卡片组件,对应的,信息显示组件的加载位置为模拟下发页面的卡片组件上设定用于显示待显示元素数据的位置。基于此,本方案在信息页面中加载信息显示组件时,包括:响应于信息页面为贴吧页面,在贴吧页面中用于显示待显示元素数据的表格组件中加载信息显示组件;和/或响应于信息页面为模拟下发页面,在模拟下发页面中用于显示待显示元素数据的卡片组件中加载信息显示组件。48.示例性的,在信息页面为贴吧页面时,在贴吧页面中加载表格组件,并在表格组件中用于显示待显示元素数据的位置加载信息显示组件,此时表格组件作为贴吧页面的子组件进行加载,信息显示组件作为表格组件的子组件进行加载。在信息页面为下发模拟页面时,在先发模拟页面中加载卡片组件,并在卡片组件中用于显示待显示元素数据的位置加载信息显示组件,此时卡片组件作为模拟下发页面的子组件进行加载,信息显示组件作为卡片组件的子组件进行加载。49.在一个可能的实施例中,信息显示组件设计为函数式组件,并且信息显示组件基于vue框架的render函数以及通过babel插件引入的jsx函数进行开发,声明信息显示组件为函数式组件(functional:true)并写入render函数,则无需再写template模版渲染。本方案将信息显示组件设计为函数式组件,由于函数式组件指示函数,可有效降低渲染开销,提高数据渲染效率,并且结合jsx语法开发函数式组件得到信息显示组件,信息显示组件同时兼容createelement和template渲染模式,支持在不同的信息页面引入信息显示组件,在同一位面展示多元内容,无需书写createelement复杂冗余的代码以及大量v-if条件指令,通过jsx语法返回需要显示的内容,使代码逻辑更清晰、更易维护和复用,有效减少重复代码的书写,提高了开发速度,当后续有更多新的信息页面需要展示待显示信息,开发人员仅需关注该函数式组件即可,无需再维护多套不同语法的逻辑代码。50.可以理解的是,待显示信息的获取与信息显示组件的加载步骤之间不存在固定的先后执行顺序,待显示信息的获取、信息显示组件的加载可先后进行,也可同步进行。51.s203:将待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,信息显示组件兼容不同信息页面的渲染模式。52.示例性的,在获取待显示信息以及加载信息显示组件后,将待显示信息传递至信息显示组件,由信息显示组件对接收到的待显示信息进行处理以确定待展示内容。53.在一个可能的实施例中,待显示信息包括信息类型和待显示元素数据,基于此,信息显示组件在对待显示信息进行处理确定待展示内容时,可以是根据信息类型对待显示元素数据进行处理确定待展示内容。基于此,本方案提供的信息显示组件在根据信息类型对待显示元素数据进行处理确定待展示内容时,可以是根据信息类型确定数据处理方式,并基于数据处理方式对待显示元素数据进行处理确定待展示内容。即预先根据不同的信息类型确定对待显示元素数据的数据处理方式,在接收到待显示信息时,根据信息类型确定数据处理方式,并按照确定的数据处理方式对待显示元素数据进行处理。54.在一个可能的实施例中,可根据不同的信息类型设定不同的数据处理方式,并可将数据处理方式配置在不同的数据处理子组件中,由数据处理子组件基于配置的数据处理方式对待显示元素数据进行处理得到待展示内容。可选的,对于处理方式较为简单的数据处理方式或者是待显示数据为较为简单的数据类型,可直接由信息显示组件进行处理,而对于处理方式较为复杂的数据处理方式或者是待显示数据为较为复杂的数据类型,可由数据处理子组件进行处理。55.s204:通过信息显示组件渲染待展示内容,并按照信息类型对应的内容展示形式显示渲染后的待展示内容。56.示例性的,在对待显示数据进行处理确定待展示内容后,通过信息显示组件渲染确定的待展示内容,并按照信息类型对应的内容展示形式显示渲染后的待展示内容。在一个可能的实施例中,信息显示组件在渲染待展示内容时,可以是直接由信息显示组件进行,也可以是由对应的数据处理子组件进行。57.在一个可能的实施例中,由于不同的信息类型的待展示内容的表现形式会存在区别,可根据不同的信息类型配置不同的内容展示形式,可以理解的是,待展示内容的渲染与显示可以由信息显示组件自身进行,也可以是有对应信息类型的数据处理子组件进行。例如,对于内容展示形式较简单的信息类型,可直接由信息显示组件进行内容展示,而对于复杂的内容展示形式较复杂的信息类型,可由数据处理子组件进行内容展示。58.如图3提供的一种基于内容追踪平台的组件渲染逻辑示意图所示,内容追踪平台提供贴吧模块和模拟下发模块。其中,贴吧模块提供贴吧页面,开发人员可通过贴吧页面查询用户发布的帖子的详细信息,例如输入帖子id(postid)直接查询用户发布的帖子,或者是通过用户id查找用户历史发布的帖子以及帖子id,然后根据帖子id查询用户发布的帖子。模拟下发模块提供模拟下发页面,开发人员可通过输入模拟条件(例如地区、语言、网络、用户信息),模拟用户在应用程序接收到的帖子id,并基于帖子id查询用户发布的帖子内容。59.在贴吧页面中表格组件的帖子预览列(table-帖子预览列)引入信息显示组件(图中livepostpreview组件),以及在下发模拟页面中卡片组件的设定ui位置(例如左侧ui位置)引入信息显示组件(图中livepostpreview组件),其中,贴吧页面和下发模拟页面中的信息显示组件在接收到待显示信息时,其对待显示信息的处理方式一致。60.贴吧页面或下发模拟页面中的信息显示组件在接收到待显示信息时,确定待显示信息中的信息类型(帖子类型),图中示意出长文本、视频、长视频、音频、图片、图片链接、投票七种信息类型,不同的信息类型对应不同的数据处理方式以及内容展示形式,并且数据处理方式以及内容展示形式配置在信息显示组件或对应的数据处理子组件中。61.根据信息类型确定数据处理方式,并按照数据处理方式对待显示信息中的待显示元素数据进行处理确定待展示内容,并根据信息类型对应的内容展示形式展示待展示内容。62.如图4提供的一种贴吧页面的显示示意图以及图5提供的一种模拟下发页面的显示示意图所示,例如信息类型为图片或图片链接时,可由数据处理子组件(photodialog组件)处理待显示元素数据以及渲染显示对应的待展示内容。例如,数据处理子组件利用图片的数据处理函数photocomponent()取得待显示元素数据的photourls字符串类型变量,并将photourls字符串类型变量转化为数组类型变量,取数组第一个元素作为首图预览,并可以按钮(button)形式触发对话框并查看全部图片。其中贴吧页面上的渲染显示效果和在模拟下发页面上的渲染效果如图4中的a1部分和图5中的b1部分所示,点击按钮(可以文字的形式表现,如图中“共2张图片”)后,可展开图片以及查看更多图片(例如以轮播的方式显示photourls对应的多张图片),还可显示图片内容查看引导(例如以文字指示鼠标悬停定格轮播的图片、鼠标移开轮播图片、右击新标签打开原图等)。63.例如信息类型为长文本类型时,可由数据处理子组件(longtextellipsisdialog组件)处理待显示元素数据以及渲染显示对应的待展示内容。例如,数据处理子组件取得待显示元素数据的content字段或posttext字段(后端返回有可能是content,也有可能是posttext字段),此时content字段或posttext字段为待展示内容,并判断文本长度,若文本长度在字数显示范围内,则显示全部文字;若文本长度超出字数显示范围,则折叠显示文字。其中贴吧页面上的渲染显示效果和在模拟下发页面上的渲染效果如图4中的a2部分和图5中的b2部分所示,点击文字详情按钮可展开长文本。64.例如信息类型为视频或长视频时,可由数据处理子组件(videoplayerwithcover组件)处理待显示元素数据以及渲染显示对应的待展示内容。例如,信息展示组件提取待显示元素数据的videourl视频链接字段和videocover视频封面字段(此时videourl视频链接字段和videocover视频封面字段即为待展示内容),并将传给视频播放组件进行显示。其中贴吧页面上的渲染显示效果和在模拟下发页面上的渲染效果如图4中的a3部分和图5中的b3部分所示,视频播放组件根据videocover视频封面字段显示视频封面,并在点击视频播放组件时,视频播放组件播放videourl视频链接字段对应的视频。65.例如信息类型为音频时,可由信息显示组件直接处理待显示元素数据以及渲染显示对应的待展示内容。例如,信息展示组件获取待显示元素数据的videourl音频链接(其中,视频和音频的链接都是同一个字段返回),确定该videourl音频链接对应的超链接(audiolink)并显示(该超链接即为待展示内容),点击超链接即可播放对应音频。其中贴吧页面上的渲染显示效果和在模拟下发页面上的渲染效果如图4中的a4部分和图5中的b4部分所示,点击超链接即可播放videourl音频链接对应的音频。66.例如信息类型为投票时,可由数据处理子组件(voteresultwithphotosdialog组件)处理待显示元素数据以及渲染显示对应的待展示内容。例如,数据处理子组件提取待显示元素数据的投票选项图片(photourls)、投票问题(votequestion),投票数字段(votecountlist),将投票选项图片和投票数处理好(一一对应)并传给投票组件进行显示。其中贴吧页面上的渲染显示效果和在模拟下发页面上的渲染效果如图4中的a5部分和图5中的b5部分所示,点击投票组件后即可展开显示投票详情。67.上述,通过在信息页面中加载兼容不同信息页面的渲染模式的信息显示组件,并将信息页面需要显示的待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,并通过信息显示组件渲染显示待展示内容,通过信息显示组件兼容不同信息页的渲染模式,针对信息显示组件进行开发即可,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰、更易维护和复用,有效提高开发效率。同时,以函数式组件的形式开发信息显示组件,聚合不同类型帖子预览的前端代码逻辑,当多个信息页面基于不同的渲染模式进行开发时,本方案基于jsx概念提供一种同时兼容createelement和template渲染模式的组件实现方案,无需书写复杂冗余的createelement代码以及大量v-if条件指令,使代码逻辑更清晰、更易维护和复用。并且后续有更多新的信息页面需要展示帖子内容时,开发人员仅需关注这个函数式的信息显示组件即可,不用维护多套不同语法的逻辑代码。并且通过信息显示组件处理及渲染显示待显示信息,在待显示信息的处理显示出现异常时,可快速精准定位异常位置以异常原因,例如在某个待显示信息(假设是“图片”类型)出现展示不符合预期、取值失败、或者代码报错的情况时,可以直接到信息显示组件中看代码逻辑,快速精准定位异常位置以异常原因。68.图6是本技术实施例提供的一种组件渲染装置的结构示意图。参考图6,该组件渲染装置包括信息获取模块31、信息处理模块32和信息显示模块33。69.其中,信息获取模块31,用于获取信息页面提供的待显示信息,不同的信息页面基于不同渲染模式渲染显示数据;信息处理模块32,用于在信息页面中加载信息显示组件,并将待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,信息显示组件兼容不同信息页面的渲染模式;信息显示模块33,用于通过信息显示组件渲染显示待展示内容。70.上述,通过在信息页面中加载兼容不同信息页面的渲染模式的信息显示组件,并将信息页面需要显示的待显示信息传递至信息显示组件,由信息显示组件对待显示信息进行处理确定待展示内容,并通过信息显示组件渲染显示待展示内容,通过信息显示组件兼容不同信息页的渲染模式,针对信息显示组件进行开发即可,无需针对不同渲染模式的信息页面开发逻辑相同但语法不同的代码,使代码逻辑更清晰、更易维护和复用,有效提高开发效率。71.在一个可能的实施例中,待显示信息包括信息类型和待显示元素数据。72.在一个可能的实施例中,信息处理模块32在信息页面中加载信息显示组件时,包括:根据待显示元素数据在信息页面上的显示位置,在显示位置中加载信息显示组件。73.在一个可能的实施例中,信息页面包括贴吧页面和模拟下发页面,贴吧页面基于render函数的渲染模式渲染显示数据,模拟下发页面基于template模板的渲染模式渲染显示数据,贴吧页面通过表格组件渲染显示数据,模拟下发页面通过卡片组件渲染显示数据。74.在一个可能的实施例中,信息处理模块32在信息页面中加载信息显示组件时,包括:75.响应于信息页面为贴吧页面,在贴吧页面中用于显示待显示元素数据的表格组件中加载信息显示组件;和/或76.响应于信息页面为模拟下发页面,在模拟下发页面中用于显示待显示元素数据的卡片组件中加载信息显示组件。77.在一个可能的实施例中,信息显示组件为函数式组件,信息显示组件基于vue框架的render函数以及通过babel插件引入的jsx函数进行开发。78.在一个可能的实施例中,信息显示组件在对待显示信息进行处理确定待展示内容时,包括:根据信息类型对待显示元素数据进行处理确定待展示内容。79.在一个可能的实施例中,信息显示组件在根据信息类型对待显示元素数据进行处理确定待展示内容时,包括:根据信息类型确定数据处理方式,并基于数据处理方式对待显示元素数据进行处理确定待展示内容。80.在一个可能的实施例中,信息显示模块33在通过信息显示组件渲染显示待展示内容时,包括:通过信息显示组件渲染待展示内容,并按照信息类型对应的内容展示形式显示渲染后的待展示内容。81.值得注意的是,上述组件渲染装置的实施例中,所包括的各个单元和模块只是按照功能逻辑进行划分的,但并不局限于上述的划分,只要能够实现相应的功能即可;另外,各功能单元的具体名称也只是为了便于相互区分,并不用于限制本发明实施例的保护范围。82.本技术实施例还提供了一种组件渲染设备,该组件渲染设备可集成本技术实施例提供的组件渲染装置。图7是本技术实施例提供的一种组件渲染设备的结构示意图。参考图7,该组件渲染设备包括:输入装置43、输出装置44、存储器42以及一个或多个处理器41;存储器42,用于存储一个或多个程序;当一个或多个程序被一个或多个处理器41执行,使得一个或多个处理器41实现如上述实施例提供的组件渲染方法。上述提供的组件渲染装置、设备和计算机可用于执行上述任意实施例提供的组件渲染方法,具备相应的功能和有益效果。83.本技术实施例还提供一种存储计算机可执行指令的存储介质,计算机可执行指令在由计算机处理器执行时用于执行如上述实施例提供的组件渲染方法。当然,本技术实施例所提供的一种存储计算机可执行指令的存储介质,其计算机可执行指令不限于如上提供的组件渲染方法,还可以执行本技术任意实施例所提供的组件渲染方法中的相关操作。上述实施例中提供的组件渲染装置、设备及存储介质可执行本技术任意实施例所提供的组件渲染方法,未在上述实施例中详尽描述的技术细节,可参见本技术任意实施例所提供的组件渲染方法。84.在一些可能的实施方式中,本公开提供的方法的各个方面还可以实现为一种程序产品的形式,其包括程序代码,当上述程序产品在计算机设备上运行时,程序代码用于使上述计算机设备执行本说明书上述描述的根据本公开各种示例性实施方式的方法中的步骤,例如,计算机设备可以执行本公开实施例所记载的组件渲染方法。其中,程序产品可以采用一个或多个可读介质的任意组合。当前第1页12当前第1页12
当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1