❶ vue页面缓存，keep-alive第一次无效的解决方法
方法二：使用 include + beforeRouteLeave + vuex 与方法一相似，不同的地方在于，将需要缓存的组件保存到全局变量，可以在路由的钩子函数里灵活的控制哪些组件需要缓存，那些不需要缓存；跟方法一相比，不需要每次再重新初始化数据，但是需要在vuex中保存数据；
1、在创建router实例的时候加上scrollBehavior方法
2、将需要缓存的组件加在include属性里
3、在store里加入需要缓存的的组件的变量名，和相应的方法；
4、在beforeRouteLeave钩子函数里控制需要缓存的组件
❷ vue keep-alive 不生效和多级（三级以上）缓存失败
https://cn.vuejs.org/v2/api/#keep-alive
如果安装官方的写法，已经正常完成keep-alive
请检查需要router 界面当前引入组件是否有name 属性, 下面Demo 的 Menu1
如果存在并被keep-alive的 include缓存['Menu1']，并且还没有生效
找到这个组件，看是否存在name
这个name 不存在，会导致找不到
当存在三级路由，会发现设置都没有问题，但就是不能解决问题，三级路由的界面无法缓存，据说是官方的原因，直接放三级路由是无法被keep-alive 执行生效，解决方案就是，把二级的路由name 和三级路由name 一块 放到include 内。
如果缓存的界面是 name为 Menu 1-2-1的界面， 需要缓存上一级路由name： ‘Menu1-2’ 即可以解决三级路由失败，如果是更多级（三级以上）的，也可以重复以上操作（具体没有试过）
关于 怎么取到到父级路由的name, 可以通过vue router的 matched 属性获取，关于include数组具体的处理方式，看个人喜好了。
https://router.vuejs.org/zh/api/#%E8%B7%AF%E7%94%B1%E5%AF%B9%E8%B1%A1%E5%B1%9E%E6%80%A7
如果文章内存在问题，可以联系作者哦
❸ 解决vue keepAlive 二次进入页面显示首次缓存问题
问题场景： 当某个带有筛选条件查询列表的页面需要进行缓存，以便不再需要重复进行选择或者输入筛选条件的时候，我们就可以利用keepAlive来进行缓存，但keepAlive也存在着一些坑，这是需要注意的地方。
如何利用keepAlive进行缓存
1、在路由meta内定义keepAlive，来设置需要被缓存的页面
meta: { keepAlive: true }
ture: 需要缓存的路由；false:不需要缓存的路由
2、判断router-view
被keep-alive包裹的为需要缓存的页面，这样我们就可以通过keepAlive来切换哪些页面需要缓存，哪些不需要缓存。
3、进入详情页面缓存，否则不缓存
路由守卫钩子 beforeRouteLeave 离开页面路由的时候出发； 当离开缓存页面，进入详情页面的时候，我们将缓存页面keepAlive设置true，如果离开缓存页面，不是进入详情页面的时候，我们设置为false，不进行缓存。
这是最基本的缓存设置，但是keepAlive也留下了一个大坑。
keepAlive二次进入页面显示首次缓存问题
第一次从缓存页面进入详情页再返回到缓存页面的时候，页面条件能被正确的缓存下来，但是当我们切换到别的路由，再一次进入该缓存页修改查询条件，并进入详情后返回缓存页，此时缓存的是页面状态是第一次进入该页面的时候的状态，也就是说，第二次进入页面的时候，该缓存读取的是第一次的缓存，这就非常的坑了。 所以通过下面的刷新缓存路由的方式来解决这个问题。
1、调整 router-view
定义一个isRouterAlive变量，用来刷新keep-alive;通过provide向下面子孙组件们暴露一个reload方法，用来刷新缓存。
2、设置缓存
子组件注册inject: ['reload'] 方法，beforeRouteEnter钩子在进入缓存页面的时候通过通过判断路由是否是来自详情页面，如果不是详情页，我们就刷新缓存，如果是详情页，就不做处理。 这样就解决了，只要是路由进入过别的页面(非详情页面)，我们就刷新缓存，这样就不会出现二次进入的时候，显示的是第一次的缓存状态，同时从详情页返回后正常显示缓存数据。
❹ keep健身可以缓存视频吗
加入训练——点击“开始第一次训练”——进度条处显示“正在加载视频”——加载结束也就是缓存结束后没网也能用了