vue中页面切换但被切换页面的数据缓存

在 Vue 中，页面切换时被切换的页面数据会被销毁，如果需要缓存被切换的页面的数据，可以使用 Vue Router 的 keep-alive 组件。

具体实现如下：

1. 在需要缓存的路由组件上添加 keep-alive 标签，例如：

<keep-alive>
  <router-view></router-view>
</keep-alive>

2. 在需要缓存的路由组件中添加 name 属性，例如：

export default {
  name: 'CachePage',
  // ...
}

3. 然后在路由配置中添加 meta 属性，例如：

const router = new VueRouter({
  routes: [
    {
      path: '/cache',
      name: 'Cache',
      component: CachePage,
      meta: {
        keepAlive: true
      }
    }
  ]
})

这样就可以实现在页面切换时缓存被切换的页面数据。需要注意的是，keep-alive 组件只能缓存组件的状态，而非数据。如果需要缓存数据，可以在组件中使用 Vuex 等状态管理工具来实现数据的缓存。