zhouchijian
/
fe-drone-ci
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feature[Sidebar]: add activeMenu option

This commit is contained in:
Pan 2019-04-04 11:31:55 +08:00
parent 184125bdd3
commit c4fdddd1a4
2 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/layout/components/Sidebar/index.vue
View File

@ -3,7 +3,7 @@
<logo v-if="showLogo" :collapse="isCollapse" /> <logo v-if="showLogo" :collapse="isCollapse" />
<el-scrollbar wrap-class="scrollbar-wrapper"> <el-scrollbar wrap-class="scrollbar-wrapper">
<el-menu <el-menu
:default-active="$route.path" :default-active="activeMenu"
:collapse="isCollapse" :collapse="isCollapse"
:background-color="variables.menuBg" :background-color="variables.menuBg"
:text-color="variables.menuText" :text-color="variables.menuText"
@ -30,6 +30,15 @@ export default {
'permission_routes', 'permission_routes',
'sidebar' 'sidebar'
]), ]),
activeMenu() {
const route = this.$route
const { meta, path } = route
// if set path, the sidebar will highlight the path you set
if (meta.activeMenu) {
return meta.activeMenu
}
return path
},
showLogo() { showLogo() {
return this.$store.state.settings.sidebarLogo return this.$store.state.settings.sidebarLogo
}, },

5
src/router/index.js
View File

@ -18,7 +18,7 @@ import nestedRouter from './modules/nested'
/** /**
* hidden: true if `hidden:true` will not show in the sidebar(default is false) * hidden: true if `hidden:true` will not show in the sidebar(default is false)
* alwaysShow: true if set true, will always show the root menu, whatever its child routes length * alwaysShow: true if set true, will always show the root menu
* if not set alwaysShow, only more than one route under the children * if not set alwaysShow, only more than one route under the children
* it will becomes nested mode, otherwise not show the root menu * it will becomes nested mode, otherwise not show the root menu
* redirect: noredirect if `redirect:noredirect` will no redirect in the breadcrumb * redirect: noredirect if `redirect:noredirect` will no redirect in the breadcrumb
@ -30,6 +30,7 @@ import nestedRouter from './modules/nested'
noCache: true if true, the page will no be cached(default is false) noCache: true if true, the page will no be cached(default is false)
breadcrumb: false if false, the item will hidden in breadcrumb(default is true) breadcrumb: false if false, the item will hidden in breadcrumb(default is true)
affix: true if true, the tag will affix in the tags-view affix: true if true, the tag will affix in the tags-view
activeMenu: '/example/list' if set path, the sidebar will highlight the path you set
} }
**/ **/
@ -195,7 +196,7 @@ export const asyncRoutes = [
path: 'edit/:id(\\d+)', path: 'edit/:id(\\d+)',
component: () => import('@/views/example/edit'), component: () => import('@/views/example/edit'),
name: 'EditArticle', name: 'EditArticle',
meta: { title: 'editArticle', noCache: true }, meta: { title: 'editArticle', noCache: true, activeMenu: '/example/list' },
hidden: true hidden: true
}, },
{ {