vue路由

第一种 通过path

<router-link to="/a">pageA</router-link>

 <router-link to="/b">pageB</router-link>

 <router-view/>

第二种  通过name

<router-link :to="{name:‘pageA‘}">pageA</router-link>

<router-link :to="{name:‘pageB‘}">pageB</router-link>

<router-view/>

这里以id为例
router.js
{
   path:"/b/:id",
   name:‘pageB‘,
   props:true,  //设为true在vue页面可以直接访问id
   component:pageB
  }

pageB.vue
<template
    <div>
       this is B;
        {{id}}
    </div>
</template>
<script>
export default {
    props:[‘id‘]

}
</script>

router.js
{
      path:‘/a‘,
      name:‘pageA‘,
      component:pageA,
      children:[
        {
          path:‘test‘,
          component:test
        }
      ]
 }

router.js
{
      path:‘/a‘,
      name:‘pageA‘,
      components:{
        default:pageA,
        divid:test
      }
}

app.vue 
  <router-view/>
  <router-view name="divid" />