Nuxt EventBus - 用于许多事件

Question

在我的Nuxt应用程序中，我有一个侦听鼠标事件的画布。现在我想将这些鼠标事件发送到 DOM，一切正常。但我担心 Vue 的事件太多了，因为有成千上万的事件。当我切换到 Vue 开发工具时，我的电脑已经开始卡顿了。我觉得 Vue 只适用于简单的点击事件，但我使用它了很多。有没有更好的方法来解决这个问题？

init(){
document.addEventListener("mousemove", this.mouseMove.bind(this));
}
mouseMove(e){
EventBus.$emit("MOUSEMOVE", e);
}

Answer 1

如果您需要在这里和那里添加某些事件侦听器，也可以。只需确保在组件被破坏时删除它们，例如

mounted() {
window.addEventListener('eventName', yourMethod);
},
beforeDestroy() {
window.removeEventListener('eventName', yourMethod);
}

Answer 2

在短时间内使用debouncer怎么样？

我猜你的 DOM 并没有在每个事件上更新，需要一些时间来自我更新。因此，减慢事件总线发出的速度，就像每 50/100 毫秒就会发生一次事件火灾一样。您可以每 50 毫秒或根据需要发出到事件总线。即使您以其他方式解决问题，这也将很有帮助。