閱讀前，建議可以參考Day1：閱讀指南＆為何選擇這個題目？

▌挑戰簡介

• 題目：三十天用Vue.jS打造一個網路商城

• 挑戰內容：利用慕課網（IMOOC）的「Vue2.0+Node.js+MongoDB 全棧打造商城系統」的課程嘗試在30天內打造網路商城。

• 本篇性質：純粹學習進度的紀錄，不會有詳細的教學或解釋，因此不適合認真閱讀

▌目標

• 目標：顯示多個router-view

▌方法

• default放預設的component，EX: default: card_index
• name放component，EX: menu: menu
• router-view name=menu千萬不能埋在card_index裡面，必須埋在card_index的外面一層component
• children的router-view，必須埋在父層`

path: '/card_index',
    components: {
      default: card_index,  //預設的component
      menu: menu  // 要設router-view name=menu才會出現（必須埋在外面）
    },
    children: [{
      path: 'card1',
      name: 'card1',
      component: card1 // router-view要埋在card_index或是menu
    }, {
      path: 'card2',
      name: 'card2',
      component: card2
    }, {
      path: 'card/:id',
      name: 'card3',
      component: card3
    }]
  }

要小心：menu不是埋在card_index中，而是就是埋在外面的componemt中

//省略 這個埋在app.vue中
<router-view name="menu"/>
//省略

▌心得

因為不小心把router-view name，埋在同層的vue中，所以debug超久！！！！！