mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-05 21:49:09 +08:00
cfdaacc84f
Co-authored-by: yuehq <yuehq@helianhealth.com>
3.0 KiB
3.0 KiB
title | description | type | group | menuName | icon | order |
---|---|---|---|---|---|---|
App 多页应用 | 0 | ⚙ 组件 | App 多页应用 | 99 |
用于实现多页应用,适合于全屏模式,如果只是局部渲染请不要使用。
基本用法
类型定义为 app
,通过 pages 定义页面,支持层级,支持内嵌 schema,或者 通过 schemaApi 远程拉取页面,完整用法请参考 amis-admin 项目里的代码示例,需要修改 env
:
{
"type": "app",
"brandName": "应用名称",
"pages": [
{
"label": "分组1",
"children": [
{
"label": "父页面",
"url": "/parent",
"children": [
{
"label": "子页面",
"url": "pageA",
"schema": {
"type": "page",
"title": "Page A"
}
}
]
}
]
}
],
...
}
属性说明
-
type
请配置成app
-
api
页面配置接口,如果你想远程拉取页面配置请配置。返回配置路径json>data>pages
,具体格式请参考pages
属性。 -
brandName
应用名称。 -
logo
支持图片地址,或者 svg。 -
className
css 类名。 -
header
顶部区域。 -
asideBefore
页面菜单上前面区域。 -
asideAfter
页面菜单下前面区域。 -
footer
页面。 -
pages
Array<页面配置>
具体的页面配置。 通常为数组,数组第一层为分组,一般只需要配置 label 集合,如果你不想分组,直接不配置,真正的页面请在第二层开始配置,即第一层的 children 中。具体的页面配置也支持属性结构,每层有以下配置。
label
菜单名称。icon
菜单图标,比如:fa fa-file.url
页面路由路径,当路由命中该路径时,启用当前页面。当路径不是/
打头时,会连接父级路径。比如:父级的路径为folder
,而此时配置pageA
, 那么当页面地址为/folder/pageA
时才会命中此页面。当路径是/
开头如:/crud/list
时,则不会拼接父级路径。另外还支持/crud/view/:id
这类带参数的路由,页面中可以通过${params.id}
取到此值。schema
页面的配置,具体配置请前往 Page 页面说明schemaApi
如果想通过接口拉取,请配置。返回路径为json>data
。schema 和 schemaApi 只能二选一。link
如果想配置个外部链接菜单,只需要配置 link 即可。redirect
跳转,当命中当前页面时,跳转到目标页面。rewrite
改成渲染其他路径的页面,这个方式页面地址不会发生修改。isDefaultPage
当你需要自定义 404 页面的时候有用,不要出现多个这样的页面,因为只有第一个才会有用。visible
有些页面可能不想出现在菜单中,可以配置成false
,另外带参数的路由无需配置,直接就是不可见的。className
菜单类名。