<div class="type-placeholder" style="font-size: 15px; letter-spacing: -0.3px; color: #abb0b5; white-space: pre-wrap;"><span style="color: #000000; font-family: Pretendard; letter-spacing: -0.3px; background-color: #ffffff;">15일 전에 질문을 작성하였는데 못 보신 것 같아서 다시 글 올립니다. 밑의 글은 예전 글을 그대로 가져왔습니다.</span></div>
<div class="type-placeholder" style="font-size: 15px; letter-spacing: -0.3px; color: #abb0b5; white-space: pre-wrap;">&nbsp;</div>
<div class="type-placeholder" style="font-size: 15px; letter-spacing: -0.3px; color: #abb0b5; white-space: pre-wrap;"><span style="color: #000000; font-family: Pretendard; letter-spacing: -0.3px; background-color: #ffffff;">순환참조를 해결하기 위해서 forwardRef를 사용하는 것은 알겠습니다. 그런데 어떻게 동작하길래 이 함수가 순환참조 문제를 해결할 수 있는 것인가요? 이름만 들어서는 참조를 앞으로 한다는 것 같은데 구체적으로 어떻게 동작하는지 궁금합니다.</span></div>

<p>안녕하세요 한진탁님.<br>답변이 많이 늦어져서 죄송합니다.<br>작성해주신 질문에 대한 답변 드리겠습니다.</p><p>React 컴포넌트를 <strong>forwardRef()</strong> 라는 함수로 감싸주게 되면, 해당 컴포넌트는 함수를 두번째 매개 변수로 갖게 됩니다. 이를 통해 외부에서 <strong>ref</strong> prop을 넘길 수 있게 됩니다. 이러한 동작방식 덕분에 순환참조를 해결할 수 있습니다.<br><br>답변에 대해 더 궁금하신 사항이 있으시다면, 새로운 질문글로 작성해주시면 답변해 드리도록 하겠습니다.<br>감사합니다 🦦</p>

인프런 커뮤니티 질문&답변

forwardRef가 어떻게 동작하는지 궁금합니다.