Closed seunguri closed 3 months ago
Zoom을 막자
<OrbitControls makeDefault enableZoom={false}/>
OrbitControls
컴포넌트를 extend하자
import { useEffect } from 'react';
import { extend, useThree } from '@react-three/fiber';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
extend({ OrbitControls });
const CustomOrbitControls = () => {
const {
camera,
gl: { domElement },
} = useThree();
useEffect(() => {
const handleTouchStart = (event) => {
event.preventDefault();
};
domElement.addEventListener('scroll', handleTouchStart, {
passive: false,
});
return () => {
domElement.removeEventListener('scroll', handleTouchStart);
};
}, [domElement]);
return <orbitControls args={[camera, domElement]} />;
};
export default CustomOrbitControls;
import { OrbitControls } from '@react-three/drei';
drei 라이브러리에서 import하면 해결되는 듯?