Skip to main content
Version: 2.x

路由和菜单

路由和菜单是组织起一个应用的关键骨架,Godzilla UI 中的路由为了方便管理,使用约定大于配置的方式,脚手架会自动根据 app/pages 下的目录和文件自动生成路由配置,应用开发无需关心具体细节。

一、 路由管理

脚手架会自动扫描 app/pages 下的所有目录的文件,如果文件名是 index.jsx (或者 index.tsx ),则会认为可能是一个页面组件(另可错杀,不可放过),会将该文件所在的目录生成一个路由,格式如:qlw/cash/CashOverview,所有的路由会放在临时文件 node_modulles/@gza/quantex-scaffold/app/.tmp/path.json(注意:临时文件由脚手架生成,不能随意修改和删除)

二、 菜单管理

注意:菜单数据统一存储在服务端。开发模式时,可以配置在 app/layouts中,生产模式时,必须存储在服务端,以方便权限管理。

1. 配置在 app/layouts

静态菜单数据存放在 app/layouts,数据结构要求如下:

 规则:
1. 设置一级菜单时,id 和 pId 需设置一致,且数值唯一。
2. 设置 icon 时,是一级菜单需提供 icon 值,反之不设值。
3. 设置 url 时,不是一级菜单需提供 url 值(相对于 UI 应用 app / pages 目录下,如: system / ServiceProxy ),反之不设值。
4. 设置 appId 时,值必须和 UI 应用里 config / config.ts 文件的属性 APP_ID 的值一致,且不可以设置为关键字 portal。

layouts.main.getUserMenu = () => {
return Promise.resolve({
code: 200,
data: {
list: [
// 一级菜单
{
"id": 1, // 子菜单 ID,设置为一级菜单时与一级菜单ID一致
"pId": 1, // 一级菜单 ID
"name": "一级菜单", // 菜单名称
"icon": "icon",
"appId": "appId", // 应用ID,与 UI 应用 config / config.ts 属性 APP_ID 的值一致
},
// 子菜单
{
"id": 2, // 子菜单 ID
"pId": 1, // 一级菜单 ID
"name": "子菜单", // 菜单名称
"appId": "appId", // 应用ID,与 UI 应用 config / config.ts 属性 APP_ID 的值一致
"url": "system/ServiceProxy"
}
],
},
msg: '操作成功!',
});
};

2. 由服务端返回