在以往管理系統(tǒng)開發(fā)，相對比較大型的后臺都會做成tab選卡式、即左邊手風(fēng)琴列表導(dǎo)航菜單，右邊一個tab選卡容器。點擊左邊的菜單在右邊打開一個選卡，選卡中內(nèi)容是獨立的，選卡可以任意切換和關(guān)閉。

在組件化開發(fā)之前的普遍做法是為tab內(nèi)嵌入iframe，但現(xiàn)在既然用上vue組件開發(fā)我們就不能走老路了。我們使用elementui的tabs組件和menuNav來實現(xiàn)這個效果，我們希望點擊menuNav中的item，之后在tabs中會新開一個選卡，選卡中內(nèi)嵌一個對應(yīng)的組件，為了減少首屏加載我們希望這個組件異步加載,預(yù)覽地址:http://othcosaz6.bkt.clouddn.com,效果如下

以上就是要實現(xiàn)的效果，下面是具體步驟，具體可以直接到倉庫查看，覺得對你有幫助的話記得賞顆star哦(^_-) https://github.com/huanent/vue-admin