How to pass url parameters to Vuejs

Question

I\'m building an app with laravel and VueJs and I was wondering how to pass a url parameter like the user slug or the user id to vuejs in a proper way to be able to use that pa

Answer 1

either using the $route of the vue:

const User = {
  template: '
User {{ $route.params.id }}
'
}
const router = new VueRouter({
  routes: [{ path: '/user/:id', component: User }]
})

or you can decouple it by using props

const User = {
  props: ['id'],
  template: '
User {{ id }}
'
}
const router = new VueRouter({
  routes: [
    { path: '/user/:id', component: User, props: true },

    // for routes with named views, you have to define the `props` option for each named view:
    {
      path: '/user/:id',
      components: {
        default: User,
        sidebar: Sidebar
      },
      props: {
        default: true,
        // function mode, more about it below
        sidebar: route => ({ search: route.query.q })
      }
    }
  ]
})