[Vuejs]-How to pass Dynamic Props through Routes in Vue 3?

by

0👍

Here it is,
Router link

 <router-link
  :to="{
         name: 'child-component',
         params: { id: id, name: name },
        }" >test
</router-link>

// Id and name are dynamic value

route.js file

const router = createRouter({
    routes: [
        {path: "/child-component/:id/:name", name: "child-component", component: ChildComponent},
    ]
})

You can access the params at the child component

 <span>Name: {{ $route.params.name }} Id: {{ $route.params.id }}
 </span>

Leave a comment