Skip to content

Latest commit

 

History

History
25 lines (15 loc) · 825 Bytes

动态组件 & 异步组件.md

File metadata and controls

25 lines (15 loc) · 825 Bytes

动态组件

我们使用过多标签的is来进行组件之间的切换。

<component :is="currentTabComponent"></component>

这时每次切换到新的组件的时候,组件都会被从新加载,这意味着切换之前组件的状态不会被保存。

但是有些时候当在这些组件之间切换的时候,会想保持这些组件的状态,以避免反复重渲染导致的性能问题。

为了解决这个问题,我们可以用一个 <keep-alive> 元素将其动态组件包裹起来。

<!-- 失活的组件将会被缓存!-->
<keep-alive>
  <component :is="currentTabComponent"></component>
</keep-alive>

注意:注意这个 <keep-alive> 要求被切换到的组件都有自己的名字,不论是通过组件的 name 选项还是局部/全局注册。