1. 程式人生 > >vue同級可以有多個router-view檢視

vue同級可以有多個router-view檢視

官方文件:命名檢視

問題:在製作類似youtube的官網的時候,用到了公共頭部,側邊欄以不同方式展現,中心部分三大部分內容,為了實現單頁面,需要分成多個檢視。

  • 有時候想同級展示多個檢視,例如建立一個佈局,有 sidebar(側導航) 和 main(主內容) 兩個檢視,這個時候命名檢視就派上用場了。
  • 你可以在介面中擁有多個單獨命名的檢視,而不是隻有一個單獨的出口。如果 router-view 沒有設定名字,那麼預設為 default。
一個檢視使用一個元件渲染,因此對於同個路由,多個檢視就需要多個元件。確保正確使用 components 配置(帶上 s):
const router = new
VueRouter({ routes: [ { path: '/', components: { default: Foo, a: Bar, b: Baz } } ] })