Optional param in vuejs router

Solution 1:

Just adding a question mark ? will make it optional.

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

It works for Vue Router 2.0 onward.

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

Solution 2:

For advanced routes matching patterns the manual says :

vue-router uses path-to-regexp as its path matching engine, so it supports many advanced matching patterns such as optional dynamic segments, zero or more / one or more requirements, and even custom regex patterns. Check out its documentation for these advanced patterns, and this example of using them in vue-router.

path-to-regexp page/manual => https://github.com/pillarjs/path-to-regexp/tree/v1.7.0#parameters

Solution 3:

Additionally, you can also send different params, from where you call your route.

<router-link
    :to="{
     name: 'ComponentName',
     params: { member: {}, otherParams: {} }
     }"
>