[发明专利]一种快速透出web页面模块的方法及装置

说明书

本发明公开了一种快速透出web页面模块的方法及装置。所公开的快速透出web页面模块的方法，包括：接收与待快速透出的web页面模块相关的关键字；基于关键字在web页面中搜索和快速透出待快速透出的web页面模块，其中，每个web页面包括至少一个web页面模块，每个待快速透出的web页面模块包括至少一个组件。所公开的技术方案可以快速搜索需要的页面信息模块，并将这些页面信息模块显示到浏览器的最前面、最直观的位置。

技术领域

本发明涉及web应用和开发领域，尤其涉及一种快速透出web页面模块的方法及装置。

背景技术

随着使用React、vue或者其他框架开发web应用的盛行，组件化开发的思想越来越普遍。然而，如果页面的模块(包括至少一个组件)或其包括的组件越来越多，信息量越来越大，要查找的模块就会分散在页面中不易被找到。

另外，例如，对于每次只能在客户端或浏览器中显示一个页面的单页面形式的web应用，要查找的模块可能在多个页面中的一个页面中，这个页面可能不是顶部页面，因此会出现多页面路由的情况。

图1示例性地示出了单页面应用中的3个不同的页面结构。图1所示的单页面应用包括3个不同的页面(A页面、B页面和C页面，对应3个不同的路由A、B、C)，每个页面下都有4个模块。在现有技术中，在当前的顶部页面是A页面(即，A路由)的情况下，是无法实现对于C页面(即，C路由)中的各个模块(例如，C1-C4模块)的快速查找和显示(即，快速透出)的。

尽管在面向浏览器的应用中，由于功能和模块可能比面向客户端的应用拆分得更加明显，因此，可以通过React Router来管理页面路由，这样会使路由管理和查找更加方便。然而，如果用户要找到某个页面的某个模块，仍然需要通过多次转路由的方式来进行多次查找，不能通过简单的全局搜索来一次性地查找和显示所需要的模块。

因此，需要提出一种新的技术方案，以快速搜索需要的页面信息模块，并将这些页面信息模块显示到浏览器的最前面、最直观的位置。

发明内容

根据本发明的快速透出web页面模块的方法，包括：

接收与待快速透出的web页面模块相关的关键字；

基于关键字在web页面中搜索和快速透出待快速透出的web页面模块，

其中，每个web页面包括至少一个web页面模块，每个待快速透出的web页面模块包括至少一个组件。

根据本发明的快速透出web页面模块的方法，在接收与待快速透出的web页面模块相关的关键字的步骤之前，还包括：

建立关键字与待快速透出的web页面模块之间的映射关系。

根据本发明的快速透出web页面模块的方法，在接收与待快速透出的web页面模块相关的关键字的步骤之前，还包括：

接收用户用于输入关键字的触发操作；

向用户显示用于输入关键字的全局搜索输入框。

根据本发明的快速透出web页面模块的方法，在基于关键字在web页面中搜索和快速透出待快速透出的web页面模块的步骤之前，还包括：

将至少一个组件实现为可以独立渲染的纯UI组件；

使用容器组件来实现用于首次请求、获取待快速透出的web页面模块的内外部环境数据的接口，并且存储用于渲染待快速透出的web页面模块所需的内外部环境数据。

根据本发明的快速透出web页面模块的方法，其建立关键字与待快速透出的web页面模块之间的映射关系的步骤包括：

使用装饰器来建立关键字与待快速透出的web页面模块之间的映射关系。