【VueRouter】名前付きルート

nameでルーティングの名前を指定する。以下ではusers/1/profileの名前を設定している。

routes: [ { path: "/users/:id", 
            component: Users, 
            childeren: [{
                path: "profile", 
                component: UsersProfile, 
                name: "users-id-profile"    // ここ
　　　}]
 } ]

router-linkのto属性にはオブジェクトを渡し、nameで名前を、paramsでidなどのパラメータを指定する。

<router-link :to="{ name: 'users-id-profile', params: { id: ... } }">次のユーザーのプロフィール</router-link>

// コードから切り替える場合も同様にオブジェクトを渡す
this.$router.push({
   name: "users-id-profile",
   params: { id: 1 }
})