vue.js - beforeDestroy vue动态组件

Question

如何在切换组件之前添加警报消息？（在路径改变之前，beforeDestroy 不起作用......）

<template>
    <keep-alive>
        <component
          :is="dynamicComponent"
        />
     </keep-alive>
</template>

标签： vue.js

Answer 1

正如您已经发现的那样，当您保持组件处于活动状态时，它不会像普通组件一样抛出 " beforeDestroy" 和 " created"，因为它保持活动状态。

因此，Vue 为此定义了其他生命周期方法：

• activatedkeep-alive- 这在加载组件时被调用
• deactivated<keep-alive>-卸载组件时调用

你像这样使用它们：

export default {
    created() {
        console.log('created');
    },
    activated() {
        console.log('activated');
    },
    deactivated() {
        console.log('deactivated');
    },
    beforeDestroy() {
        console.log('beforeDestroy');
    },
}