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

【问题标题】：NuxtJS with Vuetify tabs using dynamic routes not re-rendering page带有 Vuetify 选项卡的 NuxtJS 使用动态路由而不是重新渲染页面
【发布时间】：2020-02-21 09:39:49
【问题描述】：

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

cars/_brand_name/index.vue（使 _brand_name 成为强制参数）

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

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

【问题讨论】：

标签： vuetify.js nuxt.js

【解决方案1】：

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

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

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

【讨论】：

非常感谢，我在任何地方都找不到这个！
这对我来说似乎也是个问题。只有 Nuxt 没有使用但在此组件中添加密钥并没有解决它。所以我决定选择 /item/:id 而不是 /items/:id。（/items/ 是父级）