【问题标题】:Redirect all events from one object to another将所有事件从一个对象重定向到另一个对象
【发布时间】:2018-10-29 08:17:22
【问题描述】:

我目前正在尝试用 vanilla javascript 为画布编写一个小型游戏引擎,在我当前的工作原理模型中,用户将实例化一个 Scene 类,该类将包含所有要渲染的对象以及他们的行为。每个画布一次只能有一个活动场景,因此当前未加载的场景处于非活动状态。因此,我希望能够将分派到画布的所有事件重定向到当前活动的场景。它看起来像这样:

canvas.addEventListener(/* all */, (e) => activeScene.dispatchEvent(e));

但显然这不起作用。

这里有一个类似问题的有趣答案:Listen for all events in JavaScript

这类似于遍历所有窗口属性并为所有以“on”开头的属性注册事件侦听器。

问题是,这不会捕获自定义事件,我想让用户使用从其他地方调度的自定义事件与他们的场景进行交互(例如,画布上方用于重置当前级别的按钮可以发送'reset' 事件)。

替代方案是:

  1. 用户在画布上调用自定义函数,然后在当前活动场景中调用适当的函数
  2. 用户按我的想法调度自定义事件,但还必须为该事件类型添加事件侦听器并将事件手动重定向到活动场景(或者我提供一个函数来注册自定义事件并重定向此事件输入活动场景)

在所有这些情况下,这对用户来说都是一个两步过程。我想在程序开始时注册一次所有自定义事件不会那么糟糕,但我想知道是否存在更优雅的解决方案。

【问题讨论】:

  • 每个场景都可以有自己的画布。显示活动场景的画布,隐藏所有其他画布。
  • @ChrisG 我不明白这将如何以任何身份解决我的问题。它只会转移问题,我必须有一个全局对象来跟踪活动画布而不是活动场景(现在是同义词)并将它接收到的事件调度到该画布。或者将事件分派给所有画布,他们必须在处理事件之前检查它们是否处于活动状态。
  • 这是关于替代方法的建议,这就是为什么我将其发布为评论,而不是答案。让我尝试一下,然后回复你。
  • 您能否将示例代码添加到您的问题中,以显示引擎用户将如何设置,例如,两个场景?包括用户向他们添加事件监听器?我的意思是,假设您已经实施了完美的解决方案。在这种情况下,用户的代码会是什么样子?

标签: javascript


【解决方案1】:

好的,经过一番修改后,我想出了解决方案:

我使用带有此代码的 eventListeners 重定向所有标准事件

for(let key in myObj){
    if(key.startsWith('on')) {
       myObj.addEventListener(key.slice(2), (e) => {otherObj.dispatchEvent(e)});
    }
}

并且我覆盖了默认的dispatchEvent() 方法,以便所有手动触发的事件都被重定向,而不管它们的类型如何:

myObj.dispatchEvent = (e) => {otherObj.dispatchEvent(e)};

不幸的是,第一部分是必要的,因为标准事件不是通过dispatchEvent() 方法触发的。从理论上讲,这应该将在对象(在我的情况下是画布)上触发的所有事件重定向到另一个(活动场景)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2022-12-04
    • 1970-01-01
    • 2011-02-07
    • 1970-01-01
    • 1970-01-01
    • 2014-06-07
    • 1970-01-01
    相关资源
    最近更新 更多