Vue路由跳转到新页面之后,返回之前页面保持参数状态不变

186 阅读1分钟

1. 在需要实现功能的组件上添加keep-alive标签。

<template>
    <keep-alive>
      <我是一个组件 />
    </keep-alive>
</template>

2. 在router文件相应的对象中,添加meta。

    {
      path: '/Home',
      name: 'Home',
      component: Home,
      meta: {
      	keepAlive: true
      }
    }

3. 在跳转的新页面中,添加beforeRouteLeave

    beforeRouteLeave (to, from, next) {
      to.meta.keepAlive = true
      next(0)
    }

搞定了