두 손끝의 창조자

리액트 컴포넌트는 상위 컴포넌트에서 넘겨준 props로 데이터를 받아 로직을 처리하는 형태가 대부분이다. 상위 컴포넌트의 매소드를 호출하려면 props로 넘겨받은 함수 변수를 실행해서 호출한다. 만약, 그 반대의 경우가 필요하다면? 즉, 상위 컴포넌트에서 하위 컴포넌트의 메소드를 호출하고자 할 때는 어떻게 할까? React.forwardRef와 useImperativeHanlde을 이용하여 구현한다. 하위 컴포턴트 실행할 로직을 구현하고 ref를 노출한다. const Input = React.forwardRef((props, ref) => { const somethingToDo = () => { console.log('Do Something'); } useImperativeHandle(re..