vue學習 vue項目結構圖解 vue webpack項目圖解

 

1 上面 router/index中的代碼揭示了一個事情:  默認路徑 /  導航到  HelloWorld.vue 中

2 App.vue和main.js 共同構成了一個入口文件, App.vue裏面配置了一些常用的logo等,App.vue不會隨着router的導航而消失

  因爲他是入口文件,所以一直在單頁面應用中顯示。

3  App.vue中的<router-view/>其實是說路由後的頁面在這裏顯示,而App.vue是鐵打的營盤不會變的。

4 main.js其實是App.vue主頁對應的js,他組裝了主頁App和路由器router,將來讓路由後的頁面比如Helloworld在<router-view/>處顯示

 

 

 

1. components：{App}應該是在main.js入口文件中吧，這樣的話App應該是App.vue組件中通過export default導出APP變量出來的，然後在main.js中通過import 導入App變量
2. components：{App} 寫法是ES6的寫法，在對象中，如果鍵值對一樣的話，只寫一個就可以
3. template: '<App/>' 這裏面也涉及到一個簡寫的處理，如果你不在組件上面添加屬性或者指令的話，你就可以寫成但標籤的形式 <App/>其實就是 ‘ <App><App/>’
4. <App>標籤又在哪裏呢 <App>這樣寫就是代表APP這個組件 template: '<App/>'就是代表使用APP組件的模板