keep-alive?

Router 在定義的時候，是否以 tree 的形式進行拓撲？
根組件由多個 router-view，menu、topbar、content 分別放在不同的 router-view 中，在 root 組件中控制 menu 的返回和跳轉(zhuǎn)，就可以實現(xiàn) route 來控制每個狀態(tài)了。

不要用組件，用子路由。

1. 準備工作， 假設(shè)你第一張圖的頁面是 /main ，在他的 children 里設(shè)置兩個子路由頁面
   1.1. /main/sideBar 頁面內(nèi)容就是你第二張圖的側(cè)邊欄
   1.2. /main/main 一個空頁面，寬高為0，背景透明
2. 在 /main 主頁添加 <router-view></router-view>
3. 需要顯示的時候，判斷當前路由，需要顯示時$router.push({ path: '/main/sideBar' }),不顯示時，$router.push({ path: '/main/main' })
4. 在這種情況下，通過前進后退可以控制顯隱。

個人建議: 按正常的交互，應該是后退,前進 可隱藏但顯示，需要這種效果可以用$router.replace({ path: '/main/main' }),將隱藏頁面替換掉顯示頁面

寫成公用組件，顯示隱藏狀態(tài)通過vuex統(tǒng)一控制。