React.forwardRef with typescript generics
react-hook-form 과 mui의 컴포넌트로 form 입력 컴포넌트들을 만들던 도중 상위 컴포넌트로 부터 하위 컴포넌트로 ref 를 전달해야하는 상황이 있었다. 일반적으로 props 를 하위 컴포넌트로 전달하는 방식처럼 전달했더니 아래와 같은 warning이 발생했다 공식문서 에 따르면 key와 마찬가지로 ref는 React에서 다르게 처리하기 때문에 props 전달 방식으로는 하위 컴포넌트로 전달할 수 없다. 해당 warning을 해결하기 위해서는 warning message 에 나온 것처럼 React.forwardRef 를 사용하여 ref를 전달받을 컴포넌트를 감싸주면 된다. 컴포넌트를 React.forwardRef 로 감싸면 두 번째 매개변수로 ref 를 전달 받기 때문에 이를 통해 외부에서..
FrontEnd/react
2022. 9. 20.
