vue中beforerouteleave实现页面回退不刷新的示例代码

在Vue中使用`beforerouteleave`可以实现页面回退不刷新的效果。示例代码如下：

在路由配置文件（router）中，可以通过给需要配置的路由添加`beforeRouteLeave`方法来实现页面回退不刷新的效果。

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    // 在这里添加beforeRouteLeave方法
    beforeRouteLeave(to, from, next) {
      // 判断当前页面是否是回退操作
      if (from.name === 'TargetPage') {
        // 禁止刷新，直接回到目标页面
        next(false);
      } else {
        next();
      }
    }
  },
  {
    path: '/target',
    name: 'TargetPage',
    component: TargetPage
  }
]

在上述代码中，通过判断`from.name`是否等于目标页面的`name`，来判断当前操作是否是回退操作。如果是回退操作，则使用`next(false)`来禁止刷新，直接回到目标页面；如果不是回退操作，则使用`next()`正常进行页面跳转。

需要注意的是，上述代码是在`vue-router`的版本为3.x的情况下实现的。不同版本的`vue-router`可能会有些许差异，请根据实际情况做相应的调整。

希望以上示例代码能够帮助到你实现Vue中页面回退不刷新的效果。