创建新的 xr 事件

Question

我是打字稿新手，我正在尝试实现相当于“双击”事件的手动输入控制器，以与我的三js应用程序中的网格进行交互。我希望按照以下方式执行此操作：

-> 我听到咔嗒声

-> 我检查最后一次点击是什么时候

-> 如果上次单击和当前单击之间的时间 < threshold

我发送一个事件

我的问题是，当我尝试分派自定义事件时，我想从我的控制器：XRTargetRaySpace 分派我的事件。当我使用文档来调度它时，我可以调度我的事件。我很难理解事件调度程序在这种情况下是如何工作的

这是描述事件映射的界面：

这是我的代码

let deltaTime = 0,
    lastclick = 0,
    MAX_DELTA_TIME = 500;
const doubleClickEvent = new CustomEvent("sandbox:doubleClick", {
    bubbles: true,
    cancelable: true,
    composed: true,
    detail: {
        deltaTime,
    },
});

controller1.addEventListener("squeezestart", (_) => {
    deltaTime = window.performance.now() - lastclick;

    if (deltaTime < MAX_DELTA_TIME) {
        controller1.dispatchEvent(doubleClickEvent);
        lastclick = 0;
    }
    lastclick = window.performance.now();
});
controller2.addEventListener("squeezestart", (_) => {
    deltaTime = window.performance.now() - lastclick;

    if (deltaTime < MAX_DELTA_TIME) {
        controller2.dispatchEvent(doubleClickEvent);
        lastclick = 0;
    }
    lastclick = window.performance.now();
});

我希望有类似的东西：

controller1.addEventListener('sandbox:doubleClick', (e) => console.log(e)) 

控制器所在位置：XRTargetRaySpace | XRripSpace | XR手空间

Answer 1

我想更新这个主题，因为我认为它可以帮助将来的人。我相信不可能将新事件添加到 ThreeJs 控制器事件映射中，因此不可能有像controller.addEventListener("myCustomEvent", (e) => console.log(e)) 这样的控制器类型的东西XRTargetRaySpace、XRGripSpace ... 然而，可以创建一个名为 MyClass 的类，它扩展了包含控制器的 EventDispatcher，然后在调用此类的方法时分派 myCustomEvent。然后可以在任何 MyClass 实例上添加一个事件监听器，当触发 MyCustomEvent 时该实例将调用一个函数。