Vue JS, named router, passing Props

https://router.vuejs.org/guide/essentials/passing-props.html#object-mode
https://stackoverflow.com/questions/42309986/vuejs-get-url-query


Router.js

{
path: '/route1/:var1/:var2',
name: 'test',
component: comp1,
                        // prop1 and prop2 are props in comp1, they need to be registered to work
props: (route) => (
{
prop1: route.params.var1,
prop2: route.params.var2
}
)
},

Component:
comp1.vue

export default {
    name: 'comp1',
    props: ['prop1', 'prop2']

}


Second way
directly in comp1.vue

Router.js

{
path: '/route1/:var1/:var2',
name: 'test',
component: comp1,

},

export default {
    name: 'comp1',
    data:(){
       return {
             data1: '',
             data2: ''
         }
},
    created() {

        this.data1 = this.$route.params.var1;
        this.data2 = this.$route.params.var2;
    }