simkkong

React, Vue 등을 사용할 때, 원하는 상태인 state or data 값을 하위 컴포넌트(자식 컴포넌트)에게 넘겨주는 작업이 종종 발생한다. 이럴 때 prop drilling 이라는 용어가 나오게된다. 하위 컴포넌트가 매우 깊게 중첩될 경우에는, prop 값을 하위 컴포넌트의 하위 컴포넌트에게 넘겨주면서 관리하기가 어려워진다. 이러한 관리를 수월하게 할 수 있는 방법에 대해 설명하고자 한다. Prop Drilling Prop Drilling은 위의 설명처럼, state or data를 여러 하위 컴포넌트를 통과해 특정 하위 컴포넌트에게 전달하는 비공식 용어. 문제점은 넘겨주는 대부분의 하위 컴포넌트에 넘겨준 prop 값이 불필요한 값이란 것이다. 대략 3개의 하위 컴포넌트를 거치는 정도이면, 괜찮..