Vue 'activated' 生命周期钩子
示例
使用 activated 生命周期钩子来记录每次调用 activated 钩子时的情况。
export default {
mounted() {
console.log("mounted");
const liEl = document.createElement("li");
liEl.innerHTML = "mounted";
this.$refs.olEl.appendChild(liEl);
},
activated() {
console.log("activated");
const liEl = document.createElement("li");
liEl.innerHTML = "activated";
this.$refs.olEl.appendChild(liEl);
}
}
定义和用法
当一个被缓存的组件插入到 DOM 中时，activated 生命周期钩子会运行。
组件可以使用内置的 <KeepAlive> 组件进行缓存。
一个被缓存的组件创建后，可以被插入和移除 DOM 多次，每次这样的被缓存组件被插入 DOM 时，都会调用 activated 生命周期钩子。
注意： activated 和 mounted 钩子之间的区别在于，当一个已存在的缓存组件被插入到 DOM 时，mounted 钩子不会被调用。
相关页面
Vue 教程：Vue 生命周期钩子
Vue 教程：'activated' 钩子
Vue 教程：'deactivated' 钩子
Vue 教程：'mounted' 钩子
Vue 教程：'unmounted' 钩子
Vue 参考：Vue 'deactivated' 生命周期钩子
Vue 参考：Vue 'mounted' 生命周期钩子
Vue 参考：Vue 'unmounted' 生命周期钩子
