页面更新方法、装置、计算机设备和存储介质与流程

本技术涉及移动互联，特别是涉及一种页面更新方法、装置、计算机设备和存储介质。

背景技术：

1、随着移动互联的发展，客户端混合开发越来越流行，越来越多的功能模块使用h5离线包开发并嵌入客户端的应用程序中，客户端的原生页面在与h5离线包进行交互时，h5页面将以容器为载体呈现在原生应用程序上，一个应用程序上一般有多个h5容器。

2、由于容器的控制权在原生系统上，原生页面与h5容器的h5页面进行切换和更新时，h5容器由于无法确定当前正在展示的页面，因此不能精确对页面进行更新。

3、传统的页面更新方式是采用订阅模式对页面更新事件进行订阅，此方法需要提前注册事件，当事件发生时，即刻更新数据，然而随着客户端配置的h5容器的逐渐增多，客户端需要展示的页面也随之增多，传统的订阅方法存在资源浪费的问题。

技术实现思路

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、在其中一个实施例中，所述装置还包括：

34、数据清除模块，用于当触发的预设生命周期函数接口为容器销毁接口时，调用所述预设生命周期函数接口内封装的页面数据清除方法，将所述目标容器中的数据进行清除。

35、在其中一个实施例中，所述数据获取模块，还用于当所述更新类型为跨容器页面更新，且触发的预设生命周期函数接口为容器不可见接口时，调用所述预设生命周期函数接口内封装的页面更新方法，获取所述目标更新页面的页面生成数据；所述容器不可见接口用于实现将所述目标容器对应的目标更新界面对所述客户端不可见；

36、所述页面更新模块，还用于当所述预设生命周期函数接口中的容器可见接口被重新触发时，根据所述页面生成数据生成所述目标更新页面。

37、第三方面，本技术还提供了一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，所述处理器执行所述计算机程序时实现上述的方法的步骤。

38、第四方面，本技术还提供了一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述的方法的步骤。

39、上述页面更新方法、装置、计算机设备和存储介质，响应页面更新操作，确定页面更新操作的更新类型，监听页面更新操作触发的预设生命周期函数接口，其中，预设生命周期函数接口由目标更新页面对应的目标容器预先为原生页面设置。当更新类型为跨容器页面更新，且触发的预设生命周期函数接口为容器可见接口时，说明用于生成展示页面的容器发生了转换，且需要在客户端将更新的页面进行展示，此时调用预设生命周期函数接口内封装的页面更新方法，从原生页面直接获取目标更新页面的页面生成数据，根据页面生成数据生成目标更新页面，通过预先将页面更新方法封装并设置在预设生命周期函数的接口内，当生命周期函数的对应接口被触发时，即可根据页面更新方法直接获取页面生成数据，无需提前为可能发生的页面更新注册事件，通过容器自身的生命周期函数就可以在实现原生和h5页面数据同步，精确更新页面的同时，节约系统资源，提升了资源使用效率。