[解決済み] vuejs ルータのオプションのパラメータ

質問

あるコンポーネントに2つの方法でルーティングする必要があります。1つはパラメータ付き、もう1つはパラメータなしです。オプションのパラメータについて検索してみましたが、あまり情報が見つかりません。

だから私のルートは

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

プログラム上でパラメータを指定して呼び出すと、すべてうまくいきます。

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

しかし、私はこのようにナビゲーションを介して呼び出す必要があります。

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

は offers コンポーネントはプロップを受け取ります。

props: ['member'],

そして、このように使用されるコンポーネント

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

このように、ルートを複製して、そのうちの1つをプロップスを取らないようにすることで、なんとか動作するようになった醜い方法です。

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

実際に動作していますが、満足はしていません - また、開発モードではvuejsが警告します。 [vue-router] Duplicate named routes definition: { name: "offers", path: "/offers" }

確かに、コンポーネントの呼び出しでオプションのパラメータを指定する方法はありますね。 :member="member" ?

解決方法は？

クエスチョンマークを追加するだけ ? を選択すると、オプションになります。

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

Vue Router 2.0 以降で動作します。

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