vue如何父路由如何重定向到子路由

首頁我想讓他默認(rèn)顯示product子組件 我加了一個(gè)重定向 但是沒效果 是我重定向那里寫的不對(duì)嗎？
index.vue

<div id="main">
    <div>
      <div id="left" class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
        <router-link class="list-group-item hover-class" to="/product">product</router-link>
        <router-link class="list-group-item hover-class" to="/work">work</router-link>
        <router-link class="list-group-item hover-class" to="/contact">contact</router-link>
      </div>
      <div id="right" class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
        <router-view></router-view>
      </div>
    </div>
  </div>

index.js

routes: [
    {
      path: '/',
      name: 'Index',
      component: Index,
      children: [
        {
          path: '/product',
          name: 'Product',
          component: Product
        },
        {
          path: '/work',
          component: Work
        },
        {
          path: '/contact',
          component: Contact
        }
      ]
    },
    {
      path: '/',
      redirect: '/product'
    }
  ]