vue跳转当前页面刷新

在 Vue 中，如果要实现跳转到当前页面并刷新的效果，可以使用 `router.push()` 方法进行路由跳转，并在路由参数中添加一个随机数或时间戳，使每次路由跳转的参数都不相同。

例如：

// 获取当前路由对象
const currentRoute = this.$route;
// 构造新的路由参数，添加随机数或时间戳
const newRouteParams = {param1: 'value1', t: Date.now()};
// 跳转到当前页面并刷新
this.$router.push({name: currentRoute.name, params: newRouteParams}).catch(err => {});

这样每次路由跳转时，都会生成不同的路由参数，从而达到刷新当前页面的效果。

相关问题

vue跳转页面时候刷新

在Vue中，如果你使用`<router-link>`组件或者`router.push()`方法进行页面跳转，它们默认情况下是不会刷新页面的。如果需要在页面跳转后刷新页面，可以考虑以下两种方式：

1. 使用`<a>`标签进行跳转，并且在`href`属性中添加随机值或者时间戳，以强制浏览器重新请求资源，达到刷新页面的效果。

<a :href="'/path/to/new/page?' + Date.now()">跳转到新页面并刷新</a>

2. 在`router.push()`方法中添加一个`{query:{}}`参数，这里的`query`是路由参数的一种形式，这个参数的值可以是一个空对象，也可以是携带一些参数的对象，但是必须要有这个参数，否则页面不会刷新。

this.$router.push({path:'/path/to/new/page', query:{}})

需要注意的是，这两种方式都是强制刷新页面，会导致当前页面的所有状态和数据都丢失，因此在使用时需要慎重考虑。如果只是需要部分更新页面的内容，可以考虑使用Vue的动态组件或者异步组件来实现。

vue3路由跳转当前页面不刷新

vue3中，当路由跳转时，参数不同但路径相同时，页面不会刷新。可以通过在`<router-view>`标签上添加`key`属性来解决这个问题。当`key`属性的值不同时，页面就会重新渲染。

具体的代码如下所示：

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

<script>
import { useRoute } from 'vue-router'
export default {
  setup() {
    const route = useRoute()
    return {
      route
    }
  }
}
</script>

另外，在`watch`中监听路由的变化，当路由发生变化时可以执行相应的逻辑。例如：

import { useRoute, watch } from 'vue'
const route = useRoute()
watch(route, (newValue, oldValue) => {
  console.log('路由已触发变化', newValue, oldValue)
  // 执行相应的逻辑
})

以上两种方法都可以解决vue3路由跳转当前页面不刷新的问题。个人建议选择第一种方法，更加方便快捷。