vue 路径跳转后如何实现强制刷新界面

在 Vue 中，我们可以通过给路由添加一个唯一的 key 值，实现路由跳转时强制刷新界面的需求。

当路由跳转时，Vue 会比对路由的 key 值是否发生了改变。如果发生了改变，Vue 会将组件从缓存中移除，然后重新加载组件，从而实现强制刷新的效果。

具体操作如下：

1. 在需要强制刷新的路由上添加一个唯一的 key 值，如下所示：

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

2. 在路由跳转时，使用 $router.push() 或 $router.replace() 方法跳转到指定路由。

this.$router.push({ path: '/test', query: { id: 1 } })

这样，在每次路由跳转时，Vue 都会将组件从缓存中移除，并重新加载组件，从而实现强制刷新的效果。

另外还可以通过设置路由的 meta 属性来控制组件是否缓存，如下所示：

const router = new VueRouter({
  routes: [
    {
      path: '/test',
      component: Test,
      meta: {
        keepAlive: false
      }
    }
  ]
})

其中，keepAlive 属性为 false 表示不缓存组件，每次路由跳转都会重新加载组件。而默认情况下，keepAlive 属性为 true，表示会将组件缓存起来，多次访问同一路由时不会重新加载组件。