Vue onActivated()、onDeactivated() 被<KeepAlive>缓存组件的生命周期

onActivated()、onDeactivated() 

当组件被<KeepAlive>组件缓存时，会触发这二个生命周期。

比如: <KeepAlive><test></test></KeepAlive> ，此时test组件具有这二个生命周期

 

这二个生命周期。执行顺序依次：

onActivated() ===》  onDeactivated() 

这二个生命周期，在服务器端渲染期间不会被调用。

使用前需要被引入：

import {
    onActivated,
    onDeactivated
} from 'vue'

 

 

onActivated()

@说明：当组件被插入到 DOM 中时调用。

 

onDeactivated()

@说明：当组件从 DOM 中被移除时调用。