vue router-link页面跳转并刷新跳转页面

在 Vue 中使用 `vue-router` 跳转页面时，默认情况下是不会刷新页面的。如果需要在跳转页面时刷新页面，可以使用以下方法：

1. 利用 `key` 属性强制组件重新渲染：在 `router-link` 标签上添加 `:key="$route.fullPath"` 属性，这样在路由发生变化时，组件会重新渲染，从而达到刷新页面的效果。

<router-link :to="{ path: '/example' }" :key="$route.fullPath">跳转到 Example 页面</router-link>

2. 利用 `watch` 监听 `$route` 对象的变化：在组件内部添加以下代码，当 `$route` 对象发生变化时，执行 `window.location.reload()` 方法刷新页面。

watch: {
  $route: function() {
    window.location.reload();
  }
}

以上两种方法都可以实现页面跳转并刷新跳转页面的效果，具体使用哪种方法，可以根据具体场景选择。

相关问题

vue router-link 页面跳转 传参 取参

好的，针对你的问题，我来简单回答一下。

在 Vue.js 中，我们使用 Vue Router 来进行路由管理和页面跳转。其中，`router-link` 是 Vue Router 提供的一个组件，用于生成页面内导航链接。

如果你需要在路由跳转时传递参数，可以使用 Vue Router 提供的路由参数传递功能。具体步骤如下：

1. 在定义路由时，可以通过 `props` 属性将参数传递给组件。例如：

const router = new VueRouter({
  routes: [
    {
      path: '/user/:id',
      component: User,
      props: true
    }
  ]
})

2. 在页面中使用 `router-link` 组件时，可以通过 `to` 属性指定跳转的路径，并通过 `:to` 绑定一个对象，该对象中包含要传递的参数。例如：

<router-link :to="{ path: '/user', params: { id: 123 }}">User</router-link>

3. 在组件中通过 `this.$route.params` 可以获取到传递的参数。例如：

export default {
  props: {
    id: {
      required: true,
      type: Number
    }
  },
  created() {
    console.log(this.$route.params.id) // 输出 123
  }
}

当然，还有其他方式来传递参数，这里只是其中的一种。希望这个回答能够帮到你。

vue 用router-link页面跳转需要几步

通常需要三步：

1. 在 Vue 组件中引入 router-link 组件。
2. 在 router-link 组件中设置 to 属性，指定要跳转的页面路径。
3. 在页面中使用 router-link 组件，点击后即可跳转到指定页面。