[리액트 네이티브] Pressable 이벤트 버블링 막기(stopPropagation)

# React Native에서 이벤트 버블링 막는 방법

 

Pressable 컴포넌트의 onPress 이벤트 핸들러 호출시, 

이벤트가 더 이상 전달(이벤트 버블링) 되지 않도록 하려면

콜백함수의 인자로 들어온 event의 event.stopPropagation() 메서드를 호출해주면 된다.

 

event의 Typescript 타입은 GestureResponderEvent 로 세팅해주면 된다.

 

export default function RecipeItem({ recipe }: Props) {

  const pressButton = (event: GestureResponderEvent) => {
    event.stopPropagation();
	// ...
  };
  return (
    <Pressable onPress={pressButton} >
      {/* ... code ... */}
    </Pressable>
  );
}