Vue的多级路由实现缓存处理

代码如下：
需要在路由前置守卫调用handleKeepAlive ()

/**
 * 兼容<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’，就可以实现多级路由的缓存