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
html
<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.