当写移动端h5的时候,总会使用到vue的keep-alive组件,来防止页面重新渲染,但也不可能所有页面都去缓存,故就需要一个清除之后不需要缓存页面(组件)的方式

方案1:keep-alive包裹的组件会拥有两个生命函数activated(组件激活状态触发)和deactivated(组件非激活状态触发)

我们则可以在页面deactivated的时候调用$destroy()将此组件进行销毁

方案二:利用keep-alive的include属性,将需要缓存的组件名动态传递给keep-alive,从而实现将需要缓存的组件缓存

考虑到当用户刷新时的问题,所以方案1则需要使用store和localStorage将router的path按顺序存储起来,这样即使用户刷新也能知道用户的来和去路径,方案2则还需要将组件的name存储起来

Logo

前往低代码交流专区

更多推荐