NuxtJS 与 Vuetify 选项卡使用动态路由而不是重新渲染页面

Question

我有使用 nuxt 属性的 v-tabs 页面，每个选项卡都指向一个动态路由

cars/_brand_name/index.vue（使 _brand_name 成为必需参数）

当我加载页面 /cars/bmw:mounted get 被成功调用但在切换到其他选项卡后 URL 正确更新但页面不再重新呈现，mounted 不再被调用。

我是否错过了生命周期的某些部分？ 我应该观看路线参数并强制页面重新加载吗？ 我不记得需要单独用 Vue 来做这件事。

Answer 1

这通常是在路由组件与之前的路由相同时引起的。 强制 Vue 重新渲染页面的最佳方法是在路由器上设置一个唯一值的:key属性，通常使用$route.fullPath 。

像这样更新你的路由器视图。

<router-view :key="$route.fullPath"></router-view>