Question

我有一个Map，其中的键是Vue组件的实例，例如：

const instanceA = new Vue({...});
const instanceB = new Vue({...});

const register = new Map();
function registerInstance(instance){
    register.set(instance, []);
}

如何将回调链接到Vue组件的销毁？我希望在销毁组件时将其引用从我的Map寄存器中删除。像这样：

function registerInstance(instance){
    register.set(instance, []);
    instance.onDestroy(() => {
        register.set(instance, null);
        register.delete(instance);
    });
}

这将进行适当的清理以避免内存泄漏，但不确定如何在Vue实例的销毁过程中添加回调...

我不想在每个组件的beforeDestroy或destroyed函数中添加此逻辑。我想从组件外部添加它们，仅使用其实例指针...

我考虑过用一个调用我的代码的函数重写instance.beforeDestroyed，然后再调用该实例的原始instance.beforeDestroyed。但这感觉很不对

Answer 1

好吧，看来我们可以使用instance.$once("hook:beforeDestroy", () => {向钩子添加回调了！

一个例子是：

const instance = new Vue({});

instance.$once("hook:beforeDestroy", () => {
  console.log('Destroying!');
});

setTimeout(() => {
  instance.$destroy();
}, 1000);

<script src="https://vuejs.org/js/vue.min.js"></script>

将回调添加到Vue实例的销毁钩子

1 个答案: