Return to Question

I'm a newbie in javascript and vue.js and I'm facing some issue when trying to add a new route in an existing programme.

I created my new component in a separate file called Miniature.vue

I added the new route in the router definition:

<script>
    import {MyFunctions} from "@/components/MyFunctions.js";
    export default {
        name:"Miniature",
        computed: {
            useMyFunction() {
                MyFunction("Please do some stuff !");
            }
        }
    }
</script>

And then, in the vue instantiation, I added my new components and updated the template :

new Vue({
el: '#app',
router,
components: { Certificat, Miniature } ,
template: '<div>
            <Certificat></Certificat>
            <Miniature></Miniature>
            </div>'
})

The previous template was simply

template: '<Certificat/>'

Problem is, the url is either mywebsite/certificat/123 or mywebsite/miniature/123, both routes are executed, and my two components are displayed ! What is the purpose of the template in the Vue constructor anyway? If I remove it, nothing happens.

What am I missing here ??

I'm a newbie in javascript and vue.js and I'm facing some issue when trying to add a new route in an existing programme.

I created my new component in a separate file called Miniature.vue

I added the new route in the router definition:

  export default new Router({
  routes: [
    {
      path: '/certificat/:id',
      name: 'Certificat',
      component: Certificat
    },
    {
      path: '/miniature/:id',
      name: 'Miniature',
      component: Miniature
    }
  ]
})

And then, in the vue instantiation, I added my new components and updated the template :

new Vue({
el: '#app',
router,
components: { Certificat, Miniature } ,
template: '<div>
            <Certificat></Certificat>
            <Miniature></Miniature>
            </div>'
})

The previous template was simply

template: '<Certificat/>'

Problem is, the url is either mywebsite/certificat/123 or mywebsite/miniature/123, both routes are executed, and my two components are displayed ! What is the purpose of the template in the Vue constructor anyway? If I remove it, nothing happens.

What am I missing here ??

I'm a newbie in javascript and vue.js and I'm facing somme issue when trying to add a new route in an existing programme.

I created my new component in a separate file called Miniature.vue

I add the new route in the router definition:

<script>
    import {MyFunctions} from "@/components/MyFunctions.js";
    export default {
        name:"Miniature",
        computed: {
            useMyFunction() {
                MyFunction("Please do some stuff !");
            }
        }
    }
</script>

And then, in the view instanciation, I add my new components and updated the template :

new Vue({
el: '#app',
router,
components: { Certificat, Miniature } ,
template: '<div>
            <Certificat></Certificat>
            <Miniature></Miniature>
            </div>'
})

The previous template was simply

template: '<Certificat/>'

Problem is, the url is either mywebsite/certificat/123 or mywebsite/miniature/123, both routes are executed, and my two components are displayed ! What is the purpose of the template in the Vue constructor anyway  ? If I remove it, nothing happens.

What am I missing here ??

I'm a newbie in javascript and vue.js and I'm facing some issue when trying to add a new route in an existing programme.

I created my new component in a separate file called Miniature.vue

I added the new route in the router definition:

<script>
    import {MyFunctions} from "@/components/MyFunctions.js";
    export default {
        name:"Miniature",
        computed: {
            useMyFunction() {
                MyFunction("Please do some stuff !");
            }
        }
    }
</script>

And then, in the vue instantiation, I added my new components and updated the template :

new Vue({
el: '#app',
router,
components: { Certificat, Miniature } ,
template: '<div>
            <Certificat></Certificat>
            <Miniature></Miniature>
            </div>'
})

The previous template was simply

template: '<Certificat/>'

Problem is, the url is either mywebsite/certificat/123 or mywebsite/miniature/123, both routes are executed, and my two components are displayed ! What is the purpose of the template in the Vue constructor anyway? If I remove it, nothing happens.

What am I missing here ??