beforeDestroy vue动态组件

Question

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

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

Answer 1

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

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

activated - 当 keep-alive 加载组件时调用
deactivated - 当 <keep-alive> 卸载组件时调用

你这样使用它们：

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

beforeDestroy vue动态组件

beforeDestroy vue dynamic component

vue.js