[리액트]Consumer 대신 Hook 또는 static contextType 사용하기


[리액트]Consumer 대신 Hook 또는 static contextType 사용하기

이번에는 Context에 있는 값을 사용할 때 Consumer 대신 다른 방식을 사용하여 값을 받아 오는 방법을 알아보자.리액트에 내장되어 있는 Hooks 중에서 useContext라는 Hook을 사용하면, 함수형 컴포넌트에서 Context를 아주 편하게 사용할 수 있다. ColorBox 컴포넌트의 코드를 다음과 같이 수정해 보자.만약 children에 함수를 전달하는 Render Props 패턴이 불편하다면,useContext Hook을 사용하여 훨씬 편하게 Context 값을 조회할 수 있다.그러나 Hook은 함수형 컴포넌트에서만 사용할 수 있다는 점에 주의하자. 클래스형 컴포넌트에서는 Hook을 사용할 수 없다.이렇게 해 주면 this.context를 조회했을 때 현재 Context의 value를 가리..........



원문링크 : [리액트]Consumer 대신 Hook 또는 static contextType 사용하기