vue中使用页面缓存

前几天领导提了一个需求，是需要一个有十多个筛选的列表，工作人员在该页面操作，跳转页面，再返回时，筛选列表还是之前的数据，

当时我第一时间想到和后端一块进行，后来经过百度，发现vue中可以设置单个页面进行缓存，符合上述条件，用起来也很简单，

我使用的方式是，在app.vue映射的地方进行判断，路由中添加参数

<keep-alive>
      <!-- 需要缓存的视图组件 --> 
      <router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
      <router-view v-if="!$route.meta.keepAlive"></router-view>

{
        path: '/refundlist',
        name: 'Refundlist',
        meta: {
            keepAlive: true,
           },
        component: () => import('../views/serviceadmin/refundlist.vue')
    },

这样就可以了