Passing props to Vue.js components instantiated by Vue-router

Question

Suppose I have a Vue.js component like this:

var Bar = Vue.extend({
    props: [\'my-props\'],
    template: \'
This is bar!
\'
});
<         


        

Answer 1

 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, sidebar: false }
        }
      ]
    })

Object mode

const router = new VueRouter({
  routes: [
    { path: '/promotion/from-newsletter', component: Promotion, props: { newsletterPopup: false } }
  ]
})

That is the official answer. link