javascript - 在开发过程中处理虚假拖放事件的最佳方法是什么？

Question

原谅怪异的问题，但是我在 Electron 开发过程中遇到了拖放事件。
问题是这样的:

在开发过程中(Vue/Electron-builder等)，我以“electron-builder:serve”模式运行，当我更改某些代码时，它将重新生成应用程序浏览器窗口。这很好，因为它可以节省时间，并且可以防止编译器为小的改动而重新编译我的所有JavaScript。

不幸的是，似乎仍然存在某种DOM实例，因为如果我尝试在应用程序窗口中“删除”文件，则触发事件的文件将是原来的两倍。实际上，我在应用程序窗口中得到的事件与“重生”一样多。

最终，这变得很烦人，我关闭了开发服务器并不得不再次将其重新启动，所以我只得到一个事件。

我希望这能充分说明问题。这个问题没有涉及任何代码，只是一个环境设置查询-理想情况下，我希望应用程序在开发过程中每次“重生”时都只需要处理一个drop事件。
我不认为这是一个生产问题，而是更多的开发烦恼。

Answer 1

我在服务器模式下重复的keydown事件也遇到了类似的问题。
我用生命周期 Hook 解决了这个问题:
Vue 2:

mounted() {
    window.addEventListener('keydown', this.onKeyDown);
},
destroyed() { // or maybe beforeDestroy
    window.removeEventListener('keydown', this.onKeyDown);
}

Vue 3 Composition API:

onMounted((): void => {
    window.addEventListener('keydown', onKeyDown);
});
onBeforeUnmount((): void => {
    window.removeEventListener('keydown', onKeyDown);
});

也许这也适用于您的代码。