events.md 2.9 KB

Events

TresJS-Komponenten lösen Pointer-Events aus, wenn mit ihnen interagiert wird. Dies gilt für Komponenten, die von THREE.Object3D abgeleitet sind (wie Meshes, Groups, ...).

Pointer Events

<TresMesh
  @click="(intersection, pointerEvent) => console.log('click', intersection, pointerEvent)"
  @pointer-move="(intersection, pointerEvent) => console.log('pointer-move', intersection, pointerEvent)"
  @pointer-enter="(intersection, pointerEvent) => console.log('pointer-enter', intersection, pointerEvent)"
  @pointer-leave="(intersection, pointerEvent) => console.log('pointer-leave', pointerEvent)"
/>
Event wird ausgelöst, wenn ... Typ(en) des Eventhandler-Parameters
click ... die Ereignisse pointerdown und pointerup nacheinander auf demselben Objekt ausgelöst werden Intersection, PointerEvent
pointer-move ... der Zeiger sich über dem Objekt bewegt Intersection, PointerEvent
pointer-enter ... der Zeiger in das Objekt eintritt Intersection, PointerEvent
pointer-leave ... der Zeiger das Objekt verlässt PointerEvent

Die zurückgegebene Intersection beinhaltet das Object3D, das das Ereignis ausgelöst hat. Du kannst darauf über intersection.object zugreifen.

Standardmäßig werden Events von Objekten, die vor anderen Objekten mit Event-Handlern positioniert sind nicht blockiert. Dieses Verhalten kann aber mit der Eigenschaft blocks-pointer-events erreicht werden.