問題:點擊側邊欄Menu中MenuItem,去到相應的頁面,並更新面包屑,點擊左上角返回,路由地址改變,面包屑更新,側邊欄項的高亮菜單改變
貼出部分代碼:
router路由部分:
{ path: '/library', name: 'library', component: library, meta: { requireAuth: true, title: '圖書館列表' } }, { path: '/library/book-list', name: 'bookList', component: bookList, meta: { requireAuth: true, title: '圖書館列表 / 書刊列表' } },
側邊欄side部分:
<Menu class="sidebar-menu" :active-name="activeNav" @on-select="handleSelect"> <MenuItem name="/data-show"> <i class="iconfont"></i> 數據展示 </MenuItem> <MenuItem name="/library"> <i class="iconfont"></i> 圖書館列表 </MenuItem> </Menu>
<script> export default { name: 'sidebar', data () { return { } }, computed: { activeNav () { return this.$route.path } }, methods: { handleSelect (name) { this.$router.push(name) } } } </script>
面包屑部分:
<Breadcrumb class="breadcurmb"> <BreadcrumbItem>{{breadNav}}</BreadcrumbItem> </Breadcrumb>
computed: { breadNav () { return this.$route.meta.title } },