[发明专利]一种用于微应用数据和页面的动态加载方法

说明书

技术领域

本发明涉及电网在移动互联网环境web动态加载技术，具体说是一种用于电力信息微应用数据和页面的动态加载方法。

背景技术

Bootstrap移动应用开发框架，Bootstrap是基于 Less、丰富的 Mixin，具有丰富的删格系统，栅格类适用于与屏幕宽度大于或等于分界点大小的设备，并且针对小屏幕设备覆盖栅格类。 因此，在元素上栅格类适用于与屏幕宽度大于或等于分界点大小的设备，并且针对小屏幕设备覆盖栅格类。 因此，在元素上应用， 也影响大屏幕设备。

该框架的优点是可以快速适配PC端、移动端界面展示，具有兼容性高、响应式布局、栅格式设计等特点，但是bootstrap框架的不足是无法满足移动应用开发动态加载的需求。

Amaze UI移动应用开发框架，Amaze UI是由北京美通云动公司开发的国内首款开源跨屏、轻量级、高性能前端框架。该框架以移动优先为理念，从小屏逐步扩展到大屏，能够适配大部分设备屏幕。通过结合CSS3技术实现动画交互，使得展现效果更加平滑、高效，Web应用加载速度更快。同时该框架包含丰富的CSS、Js、Web组件，可以快速构建出体验出色的跨屏界面。在这么多优点里面，Amaze UI也不具备动态加载技术的需求。

发明内容

本发明的目的是提供一种用于微应用数据和页面的动态加载方法，该方法按照依赖关系的递归执行文档创建脚本库，减少了网络请求，也提升了用户体验。

本发明的目的通过以下技术方案实现：

一种用于微应用数据和页面的动态加载方法，其特征在于：该方法通过获取模块代码方法中的内容，去创建其中的脚本以实现动态加载；通过回调函数分段加载,按照依赖就近原则递归执行脚本，从上到下依次加载文件；通过动态加载的文件获取回调函数，进行逻辑判断实现分段加载，减少了网络请求，提升了用户体验。

具体如下：

1） 路径配置

paths: {

"basepath":basepath

}

basepath则为定义当前的路径

2）预加载项

preload:['basepath/css/main.css',

'basepath/js/modules/jquery-1.9.1.min',

'basepath/js/modules/public'

]

3）基础路径

base: "" + basepath + "/js/modules/"

4）别名配置

alias: {

"dialog": "dialog/dialog"

}

5） 页面请求

require(“dialog”);//动态加载别名样式和js

require(“index”);//动态加载逻辑js

require(“index.css”);//动态加载样式css。

动态加载信息，在预先加载的时候使用配置中的preload来加载与服务端交互的js和css。当某个页面所需加载js和css的时候，可使用require直接依赖加载，从而做到了写极少的代码，来动态加载所需的样式和逻辑。

本发明既减少了网络请求，也提升了用户体验。

具体实施方式

一种用于微应用数据和页面的动态加载方法，通过获取模块代码方法中的内容，去创建其中的脚本以实现动态加载；通过回调函数分段加载,按照依赖就近原则递归执行脚本，从上到下依次加载文件；通过动态加载的文件获取回调函数，进行逻辑判断实现分段加载。

具体如下：

1. 路径配置

paths: {

"basepath":basepath

}

basepath则为定义当前的路径

2. 预加载项

preload:['basepath/css/main.css',

'basepath/js/modules/jquery-1.9.1.min',

'basepath/js/modules/public'

]

3. 基础路径

base: "" + basepath + "/js/modules/"

4. 别名配置

alias: {

"dialog": "dialog/dialog"