前言

在vue群里待了一段時間，總是有一些新人說vue-router不會用，顯示空白。在這里記錄一下常犯的錯誤。

• new VueRouter()
  這里實例化一個vue-router對象，需要傳入一個object（通常是對象字面量）作為參數，然而新手有可能會直接傳了routes映射數組

  import Vue from 'vue';
  import VueRouter from 'vue-router';

  Vue.use(VueRouter);

  const routes = [
    {
      name: 'home',
      path: '/',
      component: home
    },
    {
      path: '*',
      redirect: '/'
    }
  ];

  // 錯誤的
  let router = new VueRouter(routes);
  // 正確的
  let router = new VueRouter({ routes });

• component和components
  還有一些小伙伴，在路由隱射上寫了components，你要記住一個路由頁面對應一個組件啊！！！

  // 提取部分
  const routes = [
    {
      name: 'home',
      path: '/',
      // 錯誤的
      // components: home
      // 正確的
      component: home
    },
    {
      path: '*',
      redirect: '/'
    }
  ];

結語

想起來的就這么多，再碰到的相關的會繼續收集進來