TresEvent y WheelEvent no son reconocidos en TypeScript y react-three-fiber (@react-three/fiber)
Tengo una caja de malla básica con un escucha de onWheel, y quiero pasar los datos del evento del mouse a una función de controlador. Sin embargo, TS lanza una serie de errores diferentes y nunca parece reconocer ThreeEvent o WheelEvent, sin importar cómo intento usarlos.
En la captura de pantalla 1, puede ver que en la propiedad onWheel TS infiere que un tipo de evento ThreeEvent<WheelEvent> es el tipo de evento. Sin embargo, cuando intento escribir el evento en mi función de controlador, obtengo un error que dice que three.js no tiene un miembro exportado ThreeEvent (captura de pantalla 2).
He intentado importar mediante importaciones nombradas (es decir, import {ThreeEvent/WheelEvent} from "three";), y también utilizando la sintaxis THREE.ThreeEvent como se utiliza en los ejemplos en los documentos de react-three-fiber. Además, encima de esta línea estoy escribiendo con éxito un useRef de la siguiente manera: const boxRef = useRef<THREE.Mesh>();
Mi tsconfig es el básico del template create-react-app, y mis versiones son las siguientes:
json
"dependencies": {
"@react-three/fiber": "^7.0.19",
"three": "^0.135.0",
"typescript": "^4.1.2"
}
"devDependencies": {
"@types/three": "^0.134.0"
}
davy.ai
Parece que tienes problemas para pasar los datos de eventos del ratón a una función controladora para una caja de malla básica con un oyente
onWheel. A pesar de inferir un tipo de eventoThreeEvent <wheelevent>en la propiedadonWheel, TypeScript no parece reconocerThreeEventoWheelEvent, y obtienes un error que dice que three.js no tiene un miembro exportadoThreeEventcuando intentas escribir el evento en la función controladora.Has intentado importar mediante importaciones nombradas, como
import { ThreeEvent / WheelEvent } from "three";y usando la sintaxisTHREE.ThreeEvent. Antes de esta línea, también escribiste correctamente unuseRefasí:const boxRef = useRef <three.mesh> ();Tu tsconfig es el básico de la plantilla create-react-app, y tus versiones para las dependencias son:
`json`"dependencies": {
"@react-three / fiber": "^ 7.0.19",
"three": "^ 0.135.0",
"typescript": "^ 4.1.2"
}
"devDependencies": {
"@types / three": "^ 0.134.0"
}
Se recomienda intentar importar
WheelEventespecíficamente desde el paquetereact, así:`typescript`import {WheelEvent} from 'react';
Esto debería permitir que TypeScript reconozca el tipo
WheelEventy escriba correctamente la función controladora de eventos.</three.mesh>