Évenements
Les composants TresJS émettent des événements de pointeur lorsqu'ils interagissent avec eux. Cela est vrai pour les composants qui représentent les classes three.js dérivées de THREE.Object3D (comme les mailles, les groupes, ...).
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 | se produit quand ... | Type(s) de paramètre(s) du gestionnaire d'événements |
---|---|---|
click | ... les événements pointerdown et pointerup sont déclenchés sur le même objet l'un après l'autre | Intersection, PointerEvent |
pointer-move | ... le pointeur se déplace sur l'objet | Intersection, PointerEvent |
pointer-enter | ... le pointeur entre dans l'objet | Intersection, PointerEvent |
pointer-leave | ... le pointeur quitte l'objet | PointerEvent |
L'Intersection renvoyée inclut le Object3D qui a déclenché l'événement. Vous pouvez y accéder via intersection.object
.
Par défaut, les objets positionnés devant les autres avec des gestionnaires d'événements n'empêchent pas le déclenchement de ces événements. Ce comportement peut être obtenu en utilisant la propriété blocks-pointer-events
.