events.md 3.1 KB

Events

TresJS componenten zenden pointer events uit wanneer er interactie mee is. Dit is het geval voor de componenten die three.js-klassen vertegenwoordigen die zijn afgeleid van THREE.Object3D (zoals netten, groepen,...).

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 wordt afgevuurd, wanneer ... Event Handler Parameter Type(s)
click ... de events pointerdown and pointerup vuurt op hetzelfde object de een na de ander Intersection, PointerEvent
pointer-move ... de pointer hangt boven het object Intersection, PointerEvent
pointer-enter ... de pointer gaat het object in Intersection, PointerEvent
pointer-leave ... de pointer is uit het object aan het gaan PointerEvent

De returned Intersection bevat de Object3D die het event triggerde. Je kan het benaderen via intersection.object.

Standaard voorkomen objecten die vóór anderen zijn geplaatst met event handlers niet dat deze gebeurtenissen worden geactiveerd. Dit gedrag kan worden bereikt door de prop blocks-pointer-events te gebruiken.