代码如下:
需要在路由前置守卫调用handleKeepAlive ()文章来源:https://www.toymoban.com/news/detail-511066.html
/**
* 兼容<layout>按需加载,实现多层路由缓存
* @param to
*/
async function handleKeepAlive (to) {
if (to.matched && to.matched.length > 2) {
for (let i = 0; i < to.matched.length; i++) {
const element = to.matched[i]
if (element.components.default.name === 'layout') {
to.matched.splice(i, 1)
await handleKeepAlive(to)
}
// 如果没有按需加载完成则等待加载
if (typeof element.components.default === 'function') {
await element.components.default()
await handleKeepAlive(to)
}
}
}
}
注意:多级路由出口为位置增加name=‘layout’,就可以实现多级路由的缓存文章来源地址https://www.toymoban.com/news/detail-511066.html
到了这里,关于Vue的多级路由实现缓存处理的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!