查询列表进入详情后返回保留查询条件(vue)

这个功能需要用到缓存<keep-alive>，缓存实现过程实现如下：

1、layout中的AppMain组件中判断$route.meta.keepAlive。

 

 

2、然后在需要缓存的列表页面的beforRouteEnter函数中将该页面路由的keepAlive设为true，判断路径来源是否它的详情页，如果是就在该路由下增加isBack参数为true，否则为false。

3、页面设为缓存后，首次加载会进入mounted函数，之后切换路由就会变成activated函数，所以在mounted中请求初始数据，在activated中判断路由中isBack参数是否为true，为true需要缓存，不重新请求数据，但需要将isBack设为false，以便下次判断，isBack参数为false说明不是从详情页进入，这种情况就需要查询条件重置，重新请求数据了。

注意: 页面设置缓存后，路由跳转不在走destroyed和mounted钩子，会走activated和deactivated钩子，若使用v-if的情况，则会走mounted和destroyed钩子，所以在需要销毁监听以及定时器之类的操作时需要在destroyed和deactivated钩子中都要写销毁逻辑。