vue router.使用route.name推入next

Question

我使用next，有以下问题。我的旧代码是这样的:

this.$router.push({path: "about/me"})

现在我需要用一些参数进行相同的调用:

this.$router.push({path: "about/me", params: {sendNotification: "1"}})

这显然不起作用，因为vue-router只允许使用params和name，而不是path，所以它必须看起来像:

this.$router.push({name: ..., params: {sendNotification: "1"}})

我可以用query代替params，但我不想让我的url看起来很丑。next的问题是，至少这是我对next的理解，它使用文件夹结构生成路由名，在我的例子中还使用locale。因此，这条路由的名称实际上是:"personal-about-me__en"

所以我的问题是:有没有一种方法可以动态地获得route.name，所以我可以写这样的东西:

this.$router.push({name: getRouteNameByPath("about/me"), params: {sendNotification: "true"}})

Answer 1

路由路径的名称与您可以给.vue文件的nameprop相匹配。因此，write是作为name: 'AboutMe'键属性，并在路由器中使用{ name: 'about-me' }。

另外，vue devtools有一个router选项卡，其中包含所有可用路由的名称。

Answer 2

这显然是行不通的，因为vue-router只允许使用带有name而不是path的参数。

为什么需要在路径旁边传递参数?你应该把参数添加到路径本身，这就是为什么vue-router不允许单独的params对象。

因此，例如，假设您的动态路由是about/me/:sendNotification，您可以提供名为route的参数:

this.$router.push({name: ..., params: {sendNotification: "1"}});

指向about/me/1.

或者你可以推入整个路径，包括参数

this.$router.push({ path: 'about/me/1' });

两者将产生完全相同的结果。