javascript - 在router.push函数vue-router 4中使用参数时出错

Question

大家好，我是 vue js 的新手，我正在尝试将参数传递给特定的路由器，当我单击卡片研究时应该会发生这种情况，然后它将重定向到名为 actions-log 的研究详细信息组件，但是当我调用它时路由器通过

this.$router.push({ name: "actions-log", params: { Id: "3" } })

它在控制台中给我一个错误说：

未捕获（承诺中）错误：不匹配 {"name":"3","params":{}}

所以任何人都可以帮我解决这个错误......

Answer 1

您可以使用path

const routeId = 3

this.$router.push({ path: `/actions-log/${routeId}` })

Answer 2

我弄清楚发生了什么我有一个名为 pageTitle 的组件，该组件包含在我使用它来制作面包屑的所有其他组件中：

this.$route.fullPath

然后将其拆分并使用以下方法循环值：

<li><router-link></router-link></li>

要制作面包屑链接，但 vue 路由器的 fullPath 属性也会返回参数，因此通过以下循环：

<router-link :to="{ name: {path} }">{{ path }}</router-link>

vue 检查路由器是否以给定的名称存在，例如，当我将 /actions-log/3 作为参数放入 url 时，它将在 :to 属性中设置，因为这种行为会引发该异常；

所以我认为我解决了以下计算函数中的问题：

我不知道是否有人有更好的主意在 vue 中创建面包屑......无论如何，非常感谢你帮助我解决这个问题。