mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-05 13:38:56 +08:00
dfb9a738ba
* feat:部分组件支持didMount事件&部分选项组件支持selectedItems参数 * feat:部分组件支持didMount事件&部分选项组件支持selectedItems参数 * feat:部分组件支持初始化事件&部分选项组件支持selectedItems参数 * feat:部分组件支持初始化事件&部分选项组件支持selectedItems参数 * feat:部分组件支持初始化事件&部分选项组件支持selectedItems参数
3.9 KiB
3.9 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
菜单类名。
事件表
当前组件会对外派发以下事件,可以通过onEvent
来监听这些事件,并通过actions
来配置执行的动作,在actions
中可以通过${事件参数名}
来获取事件产生的数据(< 2.3.2 及以下版本 为 ${event.data.[事件参数名]}
),详细请查看事件动作。
事件名称 | 事件参数 | 说明 |
---|---|---|
init | - | 组件实例被创建并插入 DOM 中时触发。2.4.1 及以上版本 |
动作表
动作名称 | 动作配置 | 说明 |
---|---|---|
reload | - | 刷新(重新加载) |
setValue | value: object 更新的数据 |
更新数据 |