数据驱动视图的方法、装置、设备及存储介质与流程

本发明实施例涉及互联网应用技术领域，尤其涉及一种数据驱动视图的方法、装置、设备及存储介质。

背景技术：

具备可视化人机交互界面的应用程序，普遍存在着数据与视图相互同步的需求。随着现代应用复杂度的不断提高，数据与视图的同步逻辑愈加复杂，据不完全统计，可视化应用首次交付测试后，发现由于视图与数据不同步造成的软件缺陷占比达50％以上。

目前，为了追求更高的视图更新性能，需要用户手动编写每个视图组件对应的hookapi，该hookapi根据原始传入数据和更新传入数据的差异，来决定是否对视图进行重新渲染。

一方面，hookapi的实现往往是繁琐且困难的，特别对于具有复杂多层次结构数据源的应用，可能需要极其复杂的逻辑判断。如果存在较多层次的jsx标签，那么还会带来更多重复的判断逻辑。

另一方面，重新渲染视图是自根达叶的，否则将有可能会意外地阻止了视图响应数据的变动，如果可变数据层级加深，这种逻辑将是极其冗余和低效的。

技术实现要素：

本发明实施例提供一种数据驱动视图的方法、装置、设备及存储介质，可以简化视图渲染开发过程，降低开发成本，提高开发效率。

第一方面，本发明实施例提供了一种数据驱动视图的方法，该方法包括：

监测视图中各视图组件对应的属性的值的变化；

在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

第二方面，本发明实施例还提供了一种数据驱动视图的装置，该装置包括：

监测模块，用于监测视图中各视图组件对应的属性的值的变化；

渲染模块，用于在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

第三方面，本发明实施例还提供了一种设备，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本发明实施例任一所述的数据驱动视图的方法。

第四方面，本发明实施例还提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本发明实施例任一所述的数据驱动视图的方法。

本发明实施例通过监测视图中各视图组件对应的属性的值的变化；仅重新渲染所述视图中与发生变化的属性对应的视图组件，可以简化视图渲染开发过程，降低开发成本，提高开发效率。

附图说明

图1a是本发明实施例一提供的一种数据驱动视图的方法的流程图；

图1b是本发明实施例一提供的一种数据驱动视图的方法中的视图拆分的视图组件与属性的对应关系示意图；

图2是本发明实施例二提供的一种数据驱动视图的方法的流程图；

图3a是本发明实施例三提供的一种数据驱动视图的方法的流程图；

图3b是本发明实施例三提供的一种数据驱动视图的方法中的对象和视图组件对应关系示意图；

图4是本发明实施例四提供的一种数据驱动视图的装置的结构图；

图5是本发明实施例五提供的一种计算机设备的结构示意图。

具体实施方式

为了使本发明的目的、技术方案和优点更加清楚，下面结合附图对本发明具体实施例作进一步的详细描述。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。

另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部内容。在更加详细地讨论示例性实施例之前应当提到的是，一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作(或步骤)描述成顺序的处理，但是其中的许多操作可以被并行地、并发地或者同时实施。此外，各项操作的顺序可以被重新安排。当其操作完成时所述处理可以被终止，但是还可以具有未包括在附图中的附加步骤。所述处理可以对应于方法、函数、规程、子例程、子程序等等。

实施例一

图1a为本发明实施例一提供的一种数据驱动视图的方法的流程图，本实施例可适用于渲染视图的情况，该方法可以由本发明实施例提供的数据驱动视图的装置来执行，该装置可采用软件和/或硬件的方式实现，该装置可集成在终端设备中或终端设备的应用端中。其中，终端设备可以为但不限于为移动终端(平板电脑或智能手机)。

其中，应用端可以为内嵌于终端设备中的某个客户端的插件，或者为所述终端设备的操作系统的插件，与内嵌于终端设备中的数据驱动视图客户端或者终端设备的操作系统中的数据驱动视图应用程序配合使用；应用端也可以为所述终端设备中一个独立的可提供数据驱动视图的客户端，本实施例对此不进行限制。

如图1a所述，本实施例的方法具体包括：

s101、监测视图中各视图组件对应的属性的值的变化。

其中，属性为视图中的显示项，通过图片、文字、视频或数字的形式呈现。一幅视图中包含至少一个属性。

具体的，可预先根据所述视图中包含的数据属性将所述视图拆分成至少一个视图组件，建立属性和视图组件的对应关系。以阅读软件视图为例，该视图中可包含用户名、年龄和阅读的书籍等属性，其中阅读的书籍可包含书名等属性。可将该视图中的用户名、年龄和阅读的书籍、书名提取出来，单独组成一个视图组件，并建立属性和视图组件的对应关系，得到如图1b所示的对应关系。

s102、在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

其中，视图组件与视图中属性的值的显示位置相对。

可选的，在监测到第一属性的值发生变化时，首先确定所述视图中使用到所述第一属性的位置；使用变化后的所述第一属性的值对所述位置进行渲染。

以图1b为示例，如果监测到书名对应的数据发生变化，则只对视图该书名所在位置处的数据进行重新渲染。

本实施例通过监测视图中各视图组件对应的属性的值的变化；仅重新渲染所述视图中与发生变化的属性对应的视图组件，可以简化视图渲染开发过程，降低开发成本，提高开发效率。

实施例二

图2是本发明实施例二提供的一种数据驱动视图的方法的流程图。本实施例以上述实施例为基础进行优化，在本实施例中，进一步将步骤监测视图中各视图组件对应的属性的值的变化优化为：定义用于包装所述视图中各视图组件对应的属性的应用程序编程接口(applicationprogramminginterface，api)，以将各个属性包装为存取访问器；监测对所述存取访问器的操作确定值发生变化的属性。

相应的，本实施例的方法具体包括：

s201、定义用于包装所述视图中各视图组件对应的属性的应用程序编程接口api，以将各个属性包装为存取访问器。

s202、监测对所述存取访问器的操作确定值发生变化的属性。

具体的，通过api监测存取访问器的读取操作，即可得知发生变化的属性。

为简单起见，以javascript编码语言展示实现原理，可扩展至其它任何编码语言。先定义用于驱动示例视图的数据结构，以图1b为例，它们由以下多个成员构成：

用于展示的视图为：

然后，利用javascript的一个api，即“object.defineproperty”，来对数据进行递归包装。为简单起见，这里只考虑null、undefined、string、boolean、number、array和object几种数据类型，现在定义函数“pack”如下：

“pack”函数将数据的各个属性都包装为“存取访问器”，这样设计后，在特定属性被解引用(即取出)即发生变化时，就会得到通知。

s203、在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

本实施例通过监测视图中各视图组件对应的属性的值的变化；仅重新渲染所述视图中与发生变化的属性对应的视图组件，可以简化视图渲染开发过程，降低开发成本，提高开发效率。

实施例三

图3a是本发明实施例三提供的一种数据驱动视图的方法的流程图。本实施例以上述实施例为基础进行优化，在本实施例中，进一步包括如下步骤：创建对象，将所述视图中各视图组件对应的属性挂载在所述对象下；针对所述对象的每个属性分别定义渲染函数，所述渲染函数用于渲染与属性相关联的视图组件；相应的，所述重新渲染所述视图中与所述第一属性对应的视图组件包括：调用与所述第一属性对应的渲染函数再次运行，重新渲染与所述第一属性对应的视图组件。

相应的，本实施例的方法具体包括：

s301、监测视图中各视图组件对应的属性的值的变化。

s302、创建对象，将所述视图中各视图组件对应的属性挂载在所述对象下。

以图1b为例，例如创建“store”对象，将各视图组件对应的属性都挂载在“store”对象下面，如图3b所示。

s303、针对所述对象的每个属性分别定义渲染函数，所述渲染函数用于渲染与属性相关联的视图组件。

具体的，在定义了渲染函数和“store”对象之后，需要知道“store”的哪些属性是在哪些渲染函数中被使用的，即哪些视图组件使用了哪些属性，这时，还需定义如下函数用于封装渲染函数render：

这样，在render内部使用数据的各个属性时，就可以知道当前运行在哪一个render中。为了达到这一目的，至少要运行所有视图组件的render一次，可以在视图首次渲染时，记录每个视图组件所使用的属性信息。

s304、在监测到第一属性的值发生变化时，调用与所述第一属性对应的渲染函数再次运行，重新渲染与所述第一属性对应的视图组件。

以步骤303为例，在属性的值被修后，自动触发对应使用到它的所有render方法的再次运行，也就是让依赖此数据的视图再次渲染。这非常容易实现，只需要在第一次运行所有render视图首次渲染时，记录数据属性到render的对应关系，然后在值被修改时，主动去调用这些render，具体可采用如下函数实现：

如果通过适当控制render的时机和频度，批量更新视图，就可以获得更优的再渲染性能。

本实施例摒弃了传统的手动对比数据差异性以及自顶而下的渲染方向的算法，而选择了维护属性与视图的精确关系，在属性值变动时精准驱动有限范围内视图的再渲染。

实施例四

图4是本发明实施例四提供的一种数据驱动视图的装置的结构图。本实施例可适用于渲染视图的情况，该装置可采用软件和/或硬件的方式实现，该装置可集成在终端设备中或终端设备的应用端中。其中，终端设备可以为但不限于为移动终端(平板电脑或智能手机)。

其中，应用端可以为内嵌于终端设备中的某个客户端的插件，或者为所述终端设备的操作系统的插件，与内嵌于终端设备中的数据驱动视图客户端或者终端设备的操作系统中的数据驱动视图应用程序配合使用；应用端也可以为所述终端设备中一个独立的可提供数据驱动视图的客户端，本实施例对此不进行限制。

如图4所示，所述装置包括：监测模块401和渲染模块402，其中：

监测模块401用于监测视图中各视图组件对应的属性的值的变化；

渲染模块402用于在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

本实施例的数据驱动视图的装置用于执行上述各实施例的数据驱动视图的方法，其技术原理和产生的技术效果类似，这里不再赘述。

在上述各实施例的基础上，所述装置还包括：组件拆分模块403；

组件拆分模块403用于根据所述视图中包含的数据属性将所述视图拆分成至少一个视图组件，建立属性和视图组件的对应关系。

在上述各实施例的基础上，所述渲染模块402具体用于：

确定所述视图中使用到所述第一属性的位置；使用变化后的所述第一属性的值对所述位置进行渲染。

在上述各实施例的基础上，所述监测模块401具体用于：

定义用于包装所述视图中各视图组件对应的属性的应用程序编程接口api，以将各个属性包装为存取访问器；监测对所述存取访问器的操作确定值发生变化的属性。

在上述各实施例的基础上，所述装置还包括：对象创建模块404；

对象创建模块404用于创建对象，将所述视图中各视图组件对应的属性挂载在所述对象下；针对所述对象的每个属性分别定义渲染函数，所述渲染函数用于渲染与属性相关联的视图组件；

相应的，所述渲染模块402具体用于：

调用与所述第一属性对应的渲染函数再次运行，重新渲染与所述第一属性对应的视图组件。

上述各实施例所提供的数据驱动视图的装置可执行本发明任意实施例所提供的数据驱动视图的方法，具备执行数据驱动视图的方法相应的功能模块和有益效果。

实施例五

图5为本发明实施例五提供的一种设备的结构示意图。图5示出了适于用来实现本发明实施方式的示例性计算机设备12的框图。图5显示的计算机设备12仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图5所示，计算机设备12以通用计算设备的形式表现。计算机设备12的组件可以包括但不限于：一个或者多个处理器或者处理单元16，系统存储器28，连接不同系统组件(包括系统存储器28和处理单元16)的总线18。

总线18表示几类总线结构中的一种或多种，包括存储器总线或者存储器控制器，外围总线，图形加速端口，处理器或者使用多种总线结构中的任意总线结构的局域总线。举例来说，这些体系结构包括但不限于工业标准体系结构(isa)总线，微通道体系结构(mac)总线，增强型isa总线、视频电子标准协会(vesa)局域总线以及外围组件互连(pci)总线。

计算机设备12典型地包括多种计算机系统可读介质。这些介质可以是任何能够被计算机设备12访问的可用介质，包括易失性和非易失性介质，可移动的和不可移动的介质。

系统存储器28可以包括易失性存储器形式的计算机系统可读介质，例如随机存取存储器(ram)30和/或高速缓存存储器32。计算机设备12可以进一步包括其它可移动/不可移动的、易失性/非易失性计算机系统存储介质。仅作为举例，存储系统34可以用于读写不可移动的、非易失性磁介质(图5未显示，通常称为“硬盘驱动器”)。尽管图5中未示出，可以提供用于对可移动非易失性磁盘(例如“软盘”)读写的磁盘驱动器，以及对可移动非易失性光盘(例如cd-rom,dvd-rom或者其它光介质)读写的光盘驱动器。在这些情况下，每个驱动器可以通过一个或者多个数据介质接口与总线18相连。存储器28可以包括至少一个程序产品，该程序产品具有一组(例如至少一个)程序模块，这些程序模块被配置以执行本发明各实施例的功能。

具有一组(至少一个)程序模块42的程序/实用工具40，可以存储在例如存储器28中，这样的程序模块42包括——但不限于——操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。程序模块42通常执行本发明所描述的实施例中的功能和/或方法。

计算机设备12也可以与一个或多个外部设备14(例如键盘、指向设备、显示器24等)通信，还可与一个或者多个使得用户能与该计算机设备12交互的设备通信，和/或与使得该计算机设备12能与一个或多个其它计算设备进行通信的任何设备(例如网卡，调制解调器等等)通信。这种通信可以通过输入/输出(i/o)接口22进行。并且，计算机设备12还可以通过网络适配器20与一个或者多个网络(例如局域网(lan)，广域网(wan)和/或公共网络，例如因特网)通信。如图5所示，网络适配器20通过总线18与计算机设备12的其它模块通信。应当明白，尽管图中未示出，可以结合计算机设备12使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、raid系统、磁带驱动器以及数据备份存储系统等。

处理单元16通过运行存储在系统存储器28中的程序，从而执行各种功能应用以及数据处理，例如实现本发明实施例所提供的数据驱动视图的方法：

监测视图中各视图组件对应的属性的值的变化；

在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

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

根据所述视图中包含的数据属性将所述视图拆分成至少一个视图组件，建立属性和视图组件的对应关系。

进一步的，所述重新渲染所述视图中与所述第一属性对应的视图组件包括：

确定所述视图中使用到所述第一属性的位置；

使用变化后的所述第一属性的值对所述位置进行渲染。

进一步的，所述监测视图中各视图组件对应的属性的值的变化包括：

定义用于包装所述视图中各视图组件对应的属性的应用程序编程接口api，以将各个属性包装为存取访问器；

监测对所述存取访问器的操作确定值发生变化的属性。

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

创建对象，将所述视图中各视图组件对应的属性挂载在所述对象下；

针对所述对象的每个属性分别定义渲染函数，所述渲染函数用于渲染与属性相关联的视图组件；

相应的，所述重新渲染所述视图中与所述第一属性对应的视图组件包括：

调用与所述第一属性对应的渲染函数再次运行，重新渲染与所述第一属性对应的视图组件。

实施例六

本发明实施例6还提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如本申请所有发明实施例提供的数据驱动视图的方法：

监测视图中各视图组件对应的属性的值的变化；

在监测到第一属性的值发生变化时，重新渲染所述视图中与所述第一属性对应的视图组件。

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

根据所述视图中包含的数据属性将所述视图拆分成至少一个视图组件，建立属性和视图组件的对应关系。

进一步的，所述重新渲染所述视图中与所述第一属性对应的视图组件包括：

确定所述视图中使用到所述第一属性的位置；

使用变化后的所述第一属性的值对所述位置进行渲染。

进一步的，所述监测视图中各视图组件对应的属性的值的变化包括：

定义用于包装所述视图中各视图组件对应的属性的应用程序编程接口api，以将各个属性包装为存取访问器；

监测对所述存取访问器的操作确定值发生变化的属性。

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

创建对象，将所述视图中各视图组件对应的属性挂载在所述对象下；

针对所述对象的每个属性分别定义渲染函数，所述渲染函数用于渲染与属性相关联的视图组件；

相应的，所述重新渲染所述视图中与所述第一属性对应的视图组件包括：

调用与所述第一属性对应的渲染函数再次运行，重新渲染与所述第一属性对应的视图组件。

本发明实施例的计算机存储介质，可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(eprom或闪存)、光纤、便携式紧凑磁盘只读存储器(cd-rom)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本文件中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。

计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括——但不限于无线、电线、光缆、rf等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言或其组合来编写用于执行本发明操作的计算机程序代码，所述程序设计语言包括面向对象的程序设计语言—诸如java、smalltalk、c++，还包括常规的过程式程序设计语言—诸如“c”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(lan)或广域网(wan)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。

注意，上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解，本发明不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此，虽然通过以上实施例对本发明进行了较为详细的说明，但是本发明不仅仅限于以上实施例，在不脱离本发明构思的情况下，还可以包括更多其他等效实施例，而本发明的范围由所附的权利要求范围决定。