프롭스(Props) 전달은 React 컴포넌트에서 부모 컴포넌트로부터 데이터를 받아오는 기본적인 방법입니다. 컴포넌트에 필요한 데이터를 부모 컴포넌트에서 프롭스로 전달하고, 해당 컴포넌트에서는 전달받은 데이터를 사용할 수 있습니다. 이 방식은 컴포넌트 트리 구조에서 위에서 아래로 데이터를 전달하는 방식으로 동작합니다. 이러한 방법은 컴포넌트 간의 데이터 흐름을 명확하게 만들어주고, 컴포넌트의 재사용성을 높이는 장점이 있습니다.

반면에, React.forwardRef()는 컴포넌트 간에 직접 참조를 전달하는 방법입니다. 주로 자식 컴포넌트에서 부모 컴포넌트로 참조를 전달할 때 사용됩니다. 이 방식은 참조를 전달해주는 컴포넌트에서 React.forwardRef()를 사용하여 참조를 받을 자식 컴포넌트에게 전달할 수 있게 합니다. 이를 통해 자식 컴포넌트에서 부모 컴포넌트의 참조를 직접 사용할 수 있습니다. 이러한 방법은 DOM 요소를 조작하는 등의 작업에 유용합니다.

따라서, 프롭스(Props) 전달은 데이터의 단방향 흐름에 적합하며 컴포넌트 간의 독립성을 유지하는 데에 좋습니다. 반면에 React.forwardRef()를 사용하는 것은 컴포넌트 간의 참조를 전달하고 동작을 조정해야 할 때 유용합니다.

추가로, React.forwardRef()를 사용할 때는 forwardRef() 함수를 사용하여 래핑된 컴포넌트로부터 전달받은 ref를 다른 컴포넌트나 DOM 요소에 전달해주어야 합니다.

#react #Props #forwardRef