Vue.js 的 keep-alive 是一个抽象组件，用于缓存动态组件。当一个组件被包裹在 标签内时，这个组件就会被缓存起来，而不是被销毁。
原理：
1. 当一个组件被包裹在 标签内时，Vue.js 会将这个组件的实例缓存起来，并且不会销毁它。
2. 如果这个组件被再次渲染到页面上，Vue.js 会从缓存中取出这个组件的实例，并将其重新挂载到页面上。
3. 在组件被缓存期间，它的生命周期钩子函数不会被调用，直到组件被重新激活时才会被调用。
4. 可以通过设置 include 和 exclude 属性来控制哪些组件需要被缓存，哪些不需要被缓存。
5. 可以通过设置 max 属性来控制缓存的最大数量，当缓存的组件数量超过了这个值时，最早被缓存的组件会被销毁。
使用场景：
1. 组件切换时保留组件状态，避免重复渲染和数据请求。
AI助手
资讯
常用工具
网站模板