web-dev-qa-db-fra.com

Param en option dans le routeur vuejs

Je dois acheminer vers un composant donné de deux manières: l'une avec un paramètre, l'autre sans. J'ai cherché des paramètres optionnels et je ne trouve pas beaucoup d'informations.

Alors mon itinéraire:

{
    path: '/offers/:member',
    component: Offers,
    name: 'offers',
    props: true,
    meta: {
        guest: false,
        needsAuth: true
    }
},

Quand je l'appelle avec le param par programme, tout va bien

this.$router.Push({ path: /offers/1234 });

Cependant, j'ai aussi besoin de l'appeler via nav comme ceci

<router-link to="/offers">Offers</router-link>

Le composant offers accepte l'accessoire

props: ['member'],

Et composant utilisé en tant que tel

<Offers :offers="data" :member="member"></Offers>

Maintenant, la mauvaise façon dont j'ai réussi à le faire fonctionner est de dupliquer l'itinéraire et de faire en sorte que l'un d'eux ne prenne pas d'accessoires:

{
    path: '/offers',
    component: Offers,
    name: 'offers',
    props: false,
    meta: {
        guest: false,
        needsAuth: true
    }
},

Cela fonctionne réellement, mais je ne suis pas content - cela aussi en mode dev vuejs me prévient [vue-router] Duplicate named routes definition: { name: "offers", path: "/offers" }

Il y a sûrement un moyen de faire un paramètre optionnel dans l'appel de composant :member="member"?

vue.js
52
yoyoma

Ajouter simplement un point d’interrogation ? le rendra facultatif.

{
    path: '/offers/:member?',
    ...
},

Cela fonctionne à partir de Vue Router 2.0.

Source: https://github.com/vuejs/vue-router/issues/235#issuecomment-245447122

117
Jacob Goh