Vue.js 如果只有slug发生变化，Vue路由器不会启动

出于某种原因，在我的Vue应用程序中，当链接页面仅更改段塞时，我的路由器出现问题。比如说

我有以下链接

<router-link :to="{ path: '/tag/tag2' }">Tag 2</router-link>
<router-link :to="{ path: '/tag/tag3' }">Tag 3</router-link>
<router-link :to="{ path: '/category/cat1' }">Category 1</router-link>

内部

views/tag.vue

加载时，它会执行

axios

请求以获取所有标签。类别等具有相同的功能

假设当前URL为

http://test.com/tag/tag1

如果单击标签2的链接，URL将发生变化，但不会发生其他任何变化。无

axios

调用等

如果我点击标签3，URL将会改变，但不会发生其他任何事情。无

axios

调用等

如果我单击Category 1，则url会发生变化，页面会加载Category视图并触发其axis请求

---

如果只有slug在更改，为什么会出现问题？

我相信您的axios调用位于组件的一个生命周期挂钩中（即创建之前的

）。问题在于，Vue路由器尽可能地重用组件。在您的情况下，从
/tag/tag1
到
/tag/tag2
，唯一改变的是参数，因此它仍然是相同的组件，路由器不会再次重新创建它

有两种解决方案：

将axios调用置于路由更新之前，这意味着每次组件中的路由更改时都会触发这些调用
将
键
属性添加到
路由器视图
，这将使路由器重新创建每个组件


来源：
我相信您的axios调用位于组件的一个生命周期挂钩中（即创建之前的
）。问题在于，Vue路由器尽可能地重用组件。在您的情况下，从
/tag/tag1
到
/tag/tag2
，唯一改变的是参数，因此它仍然是相同的组件，路由器不会再次重新创建它

有两种解决方案：

将axios调用置于路由更新之前，这意味着每次组件中的路由更改时都会触发这些调用
将
键
属性添加到
路由器视图
，这将使路由器重新创建每个组件


来源：
我猜我只是为slug添加了一个监视程序，然后发出请求？你可以这样做。这是官方文件中的完整解释。我猜我只是为slug添加了一个监视程序，并发出请求？你可以这样做。在官方文件中有完整的解释。谢谢康拉德，非常有用谢谢康拉德，非常有用
{
  path: '/tag/:slug',
  name: 'Tag',
  component: () => import('./views/tag')
}