后台布局框架组件
- Source:
Members
(inner) props
- Source:
Properties:
| Name | Type | Attributes | Default | Description | ||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
logo |
string |
<optional> |
品牌logo图片地址 |
|||||||||||||||||||||||||||||||||||||||||
title |
string |
<optional> |
MyWeb
|
品牌名称 |
||||||||||||||||||||||||||||||||||||||||
version |
string |
<optional> |
版本号徽标 |
|||||||||||||||||||||||||||||||||||||||||
href |
string |
<optional> |
点击logo调转的链接 |
|||||||||||||||||||||||||||||||||||||||||
menus |
Array |
<optional> |
菜单数据数组，与MyMenu组件一致 Properties
|
|||||||||||||||||||||||||||||||||||||||||
menuProps |
Object |
<optional> |
菜单组件配置，参考MyMenu |
|||||||||||||||||||||||||||||||||||||||||
mode |
string |
<optional> |
sidebar
|
导航模式: sidebar(侧边菜单布局)、navbar(顶部菜单布局)、both(侧边+顶部菜单布局) |
||||||||||||||||||||||||||||||||||||||||
sidebarCollaps |
Boolean |
<optional> |
false
|
默认sidebar是否收起（默认为否） |
||||||||||||||||||||||||||||||||||||||||
sidebarTheme |
string |
<optional> |
light
|
侧边栏主题，可选值：'light', 'dark', 'primary', 'gradual' |
||||||||||||||||||||||||||||||||||||||||
navbarTheme |
string |
<optional> |
light
|
顶部导航主题，可选值：'light', 'dark', 'primary', 'gradual' |
||||||||||||||||||||||||||||||||||||||||
navbarProps |
Object |
<optional> |
MyNavbar组件附加参数，mode=both 时有效 |
|||||||||||||||||||||||||||||||||||||||||
menusLevelSplit |
Boolean |
<optional> |
菜单数据第一层拆分放到navbar，与sidebar联动，mode=both 时有效 |
|||||||||||||||||||||||||||||||||||||||||
navbarActive |
Boolean |
<optional> |
navbar 菜单激活函数，menusLevelSplit=true时有效 |
|||||||||||||||||||||||||||||||||||||||||
fixed |
boolean |
<optional> |
false
|
固定菜单栏（包括侧边和顶部） |
||||||||||||||||||||||||||||||||||||||||
colorWeak |
boolean |
<optional> |
false
|
色弱模式 |
||||||||||||||||||||||||||||||||||||||||
collapsible |
boolean |
<optional> |
true
|
开启折叠切换 |
||||||||||||||||||||||||||||||||||||||||
header |
boolean |
<optional> |
true
|
显示头部 |
||||||||||||||||||||||||||||||||||||||||
rainbow |
boolean |
<optional> |
true
|
顶部导航显示海虹边框 |
||||||||||||||||||||||||||||||||||||||||
breadcrumb |
Object | function |
<optional> |
面包屑数据按路由path的映射对象或构建函数 |
|||||||||||||||||||||||||||||||||||||||||
documentTitle |
string | function |
<optional> |
默认页面标题文本，如设置该属性，即开启按路由meta的title属性设置页面标题 |
|||||||||||||||||||||||||||||||||||||||||
tab |
Object | function |
<optional> |
默认选项卡导航，如果设置该属性，即开始按路由meta的tab属性设置导航选项卡，对象字段{label, value, icon} Properties
|
属性参数
(inner) slots
- Source:
Properties:
| Name | Type | Description |
|---|---|---|
default |
string | 默认插槽，定义主体内容，通常放 router-view |
navbar |
string | 顶部菜单附加内容 |
actions |
string | 顶部菜单操作区内容，如放置：IconAction, UserAction, FullScreenAction |
sidebar |
string | 左侧菜单前置内容 |
append |
string | 左侧菜单后置内容 |
插槽
Methods
(inner) addTab(tab)
- Source:
添加选项卡
Parameters:
| Name | Type | Description | ||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
tab |
Object | 选项卡配置 Properties
|
(inner) closeTabs(value)
- Source:
关闭选项卡
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | function | 选项卡的value 或 path，也可是查找函数,return true 关闭 |
(inner) setTab(tab)
- Source:
更新当前选项卡配置
Parameters:
| Name | Type | Description |
|---|---|---|
tab |
object | 选项卡配置 {label,value,closable,path,icon} |
Events
collapse
- Source:
折叠发送改变时触发
Parameters:
| Name | Type | Description |
|---|---|---|
collapsed |
boolean | 是否折叠 |
select
- Source:
菜单项选中时触发
Parameters:
| Name | Type | Description |
|---|---|---|
item |
Object | 菜单项对象 |
tab-remove
- Source:
关闭选项卡时触发
Parameters:
| Name | Type | Description |
|---|---|---|
tab |
object | 选项卡配置对象 |
index |
number | 选项的索引 |
tab-select
- Source:
选择选项卡时触发
Parameters:
| Name | Type | Description |
|---|---|---|
tab |
object | 选项卡配置对象 |
index |
number | 选项的索引 |