Keep-alive 是 Vue 的一个内置组件，会缓存不活动的组件实例，防止重复渲染DOM。 一、原理 　　Vue 的缓存机制并不是直接存储 DOM 结构，而是将 DOM 节点抽象成了一个个 VNode节点。 　　因此，Vue 的 keep-alive 缓存也是基于 VNode节点 ...

本篇文章，我们来讲一下keep-alive的实现。 更容易看懂 Vue中，有三个内置的抽象组件，分别是keep-alive、transition和transition-group， 它们都有一个共同的特点，就是自身不会渲染一个DOM元素，也不会出现在父组件链中。 keep-alive ...

vue2.0提供了一个keep-alive组件用来缓存组件,避免多次加载相应的组件,减少性能消耗 keep-aliv是Vue.js的一个内置组件。它能够不活动的组件实例保存在内存中，而不是直接将其销毁，它是一个抽象组件，不会被渲染到真实DOM中，也不会出现在父组件链中。 它有两个生命周期 ...

1.transition name - string，用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为.fade-enter，.fade-enter-active等。默认类名为 "v" <transition> 元素作为单个元素/组件的过渡效果。< ...

使用 <keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。 当组件在 < ...

文章开头，先说一下我遇到的问题，如果不是类似业务逻辑，那么可能会遇到方法不可用的效果，淡定~~~ 我的问题是：当前有3个页面，首页（简称A）、列表页面（简称B）、详情页面（简称C），从A->B ...

前言 在Vue构建的单页面应用（SPA）中，路由模块一般使用vue-router。vue-router不保存被切换组件的状态， 它进行push或者replace时，旧组件会被销毁，而新组件会被新建，走一遍完整的生命周期。 但有时候，我们有一些需求，比如跳转到详情页面时 ...

keep-alive：主要用于保留组件状态或避免重新渲染。 比如： 有一个列表页面和一个 详情页面，那么用户就会经常执行打开详情=>返回列表=>打开详情这样的话 列表 和 详情 都是一个频率很高的页面，那么就可以对列表组件使用<keep-alive>< ...