vuejs 路由器中的可选参数
我需要以两种方式路由到某个组件 - 一种带有参数，一种没有。我搜索了可选参数，但不知何故找不到太多信息。
所以我的路线：
{
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>
现在我设法让它工作的丑陋方式是复制路线并使其中一个不使用道具：
{
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
对于匹配模式 the manual says 的高级路由：
vue-router 使用 path-to-regexp 作为其路径匹配引擎，因此它支持许多高级匹配模式，例如可选的动态段、零个或多个/一个或多个需求，甚至自定义正则表达式模式。查看这些高级模式的文档，以及在 vue-router 中使用它们的示例。
正则表达式页面/手册的路径=> https://github.com/pillarjs/path-to-regexp/tree/v1.7.0#parameters
此外，您还可以从调用路线的位置发送不同的参数。
<router-link
:to="{
name: 'ComponentName',
params: { member: {}, otherParams: {} }
}"
/>
path: /:lang?/home将为/home和/es/home执行。 （使用 Vue-Router 4.0.3，我还没有尝试过其他版本。）