为 2 个 url 创建 1 个路由（一个有参数，一个没有）

Question

我试图通过 vue-router 将用户推送到一条路由，但在一种情况下，这条路由会有参数，而在另一种情况下，它不会有参数。当它有参数时，我会在页面内显示其他组件。所以一切都取决于我是否有参数。但是当我尝试这样做时，我得到了一个错误，我无法真正将我的参数传递给路线。这是我的路线

    {
       path : '/template',
       name : 'Template',
       component : Template 

    },

我有一条没有参数的 /template 路线。所以它看起来像这样：

 this.$router.push("/template")

还有一个具有相同名称和相同路由但具有参数的另一个

 this.$router.push({path : 'template', params:{ id }})

然而，当我尝试推送第二个时，它会忽略参数的值。而且我需要这 2 条路线具有共享组件，因此 2 条路线具有相同的组件不是一个好习惯。这是我得到的错误路径“模板”已通过参数传递，但它们将被忽略。改用命名路由和参数。

Answer 1

使用查询而不是参数。

this.$router.push({path : 'template', query:{ id }})

<OtherComponent v-if="$route.query.id" />

Create 1 route for 2 urls ( one that has params and one that doesn't)