directorjs和requirejs和artTemplate模板引擒建立的SPA框架

分为4块：
A ： index.html壳子。加载B init-config.js, 加载D header.html模板
B ： init-config.js 个人信息+路由配置+权限+渲染单页。加载C navMenu.js
C： navMenu.js 处理头部+处理中间模板+总菜单。返回给B init-config.js
D： header.html模板。模板的作用，整个页面大部分除掉单页

A:Index.html:

一个空壳子，这个上面include进：header.html, require.js, init-config.js,

加进了所有的css，，，，配置了gulp打包的build，替换压缩后的文件，加入了百度统计

B:init-config.js

这个配置了：

Require.js的配置config
路由的map（键和 path路径+permission），

拿用户信息接口，返回了用户角色，姓名，权限码，存全局变量

Director.js的init方法，初始化路由

方法1，将路由map转化为对象，规则为：/aaa:function(){},键-方法，，键方法对，组合规则是directors的用法

方法2，即路由键对应的执行方法，当浏览器地址栏出现某/hash值的时候，获取此hash的路由map条目，拿到permission，

用户接口返回值判断是否登录-----》sso，

判断权限（permission与用户接口权限码，利用shiro-trie）------》403页，

去执行navMenujs拿到返回值-----》中间模板right。执行init方法（C模板介绍见后）

Ajax请求map的path路径的单页面，-------》渲染单页，根据right，是right.html(单页)或

CommonBus.html(单页)，这个根据页面挖空的结构来。

C：navMenu。Js

配置所有工程的https：//域名./

配置所有的菜单

清空container元素，移除所有监听

头部，登录，退出，用户名，游客的显示处理，监听登录/退出事件，-----》sso/首页

渲染头部模板，根据默认总菜单

渲染中间模板

渲染中间模板根据方法X

方法X：根据init传来的hash，window得来，拿到所有的一级菜单，二级菜单，三级菜单

D：header.html

所有二级菜单即各个工程，所有的页面，

整个页面（头部导航+中间模板（面包屑+左侧三级菜单等等））大部分都是这里拼的模板

架构

NavMenu.js所有工程公用，配置了总工程的菜单总表

单个工程如：investor的init-config.js只配置自己的map路由表

每个工程都有一个相同壳子A模块，每个工程有一个域名，每个工程有自己的路由表，每个工程有init-config。Js

即：A模块B模块各子工程具有自己的，

C模块D模块公用，放cdn。

C模块只作一个模块，define（‘C模块名’，【引用】，function(){}）;amd规范

D模块：公用，包括了各子工程的模板，nevMenu会根据哪个工程，渲染哪个工程的模板

头部导航几乎所有子工程可以公用模板。但是各子工程中间块设计不一样，所有有各自的中间模板。

巴特西

directorjs和requirejs和artTemplate模板引擒建立的SPA框架

A:Index.html:

B:init-config.js

C：navMenu。Js

D：header.html

架构

最新文章

热门文章