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

아리마님의 프로필 이미지
아리마

작성한 질문수

실전 리액트 프로그래밍

ContextAPI 문의

작성

·

165

1

강사님 안녕하세요.
설명해주신 ContextAPI 를 적용해 보고 있습니다.

ContextAPI 를 사용하면 부모가 가진 함수를 멀리 떨어진 자식이 편하게 호출을 할 수 있는 거 같은데요.
만약 아래 그림가 같은 DOM Tree 에서 J 컴포넌트에서 A나 C에 있는 함수를 호출하고 싶은 경우에도
ContextAPI 를 사용할 수 있을까요??

그러한 상황을 처리할 수 있는 좋은 방법이 궁금합니다.

답변 6

1

강사님이 답변해주시겠지만, 결론부터 말하자면 Context API로도 전역으로 데이터를 관리할 수 있습니다.
상위 컴포넌트인 App 컴포넌트에서 Provider로 내려주면 A나 C, J에서도 사용할 수 있죠.
그렇지만 결국 Redux를 나중에 사용 할 예정이라면 지금부터 Redux에 익숙해지는게 더 나은 선택이란
생각이 듭니다. 간단한 어플리케이션에는 Context API도 괜찮은 선택이지만 복잡한 어플리케이션에는
Redux로 작성하는 편이 미들웨어도 적용할 수 있고 더 쉽게 관리할 수 있기 때문입니다.
저도 그렇고 배우는 입장이니 당장은 크게 상관없지만 Redux를 사용하면  조건에 따라 액션을
무시할 수도 다른 액션을 발생시킬 수도 있구요.

그래서 저도 Context API는 이런게 있구나하고 Context API로 몇번 코드 작성해보고 그냥 넘어갔고
이후엔 Redux를 사용하면서 익숙해져보려고 하고있습니다.

0

이재승님의 프로필 이미지
이재승
지식공유자

위에서 언급한 것 처럼 `콘텍스트 API로 데이터 전달하기` 7:55 부분을 참고하시면 될 것 같아요
Root 의 Context API 에서 
데이터(여기서는 함수)를 변경할 수 있는 함수(setter)를 제공하는 방식입니다

그러면 A, C 등에서 setter 로 원하는 함수를 설정하고, J 에서는 설정된 함수를 사용할 수 있습니다.

0

아리마님의 프로필 이미지
아리마
질문자

네, 강사님

말씀해주신 것처럼 C 컴포넌트 내부에서 생성한 함수가 있는데 이걸 J에서 호출해 줄 수 있는지가 궁금해서요.
Root 가 Provider 로 J 쪽으로 함수를 내려줄 수 있는 건 이해가 가는데요..
C 내부에 생성한 함수를  Root로는 어떻게 전달해야 되는 걸까요?

결국 J 가 Root 의 함수를 호출하고, Root 는 C의 함수를 호출하는 방식인거죠?

0

이재승님의 프로필 이미지
이재승
지식공유자

안녕하세요
A 에서 export 로 내보낼 수 있는 함수가 아니라 컴포넌트 내부에서 생성한 함수를 말씀하신 것 같네요
Context API 는 조상의 데이터만 접근할 수 있어서 A 에서 Provider 로 제공한 데이터는 J 로 전달되지 않습니다

한 가지 방법은 A 가 해당 함수를 Root 로 전달하고 Root 가 Provider 로 내려줄 수 있겠네요
이렇게 부모에서 상태값을 관리하고 부모가 setter 를 자식에서 제공해주는 패턴이 자주 사용되긴 합니다

`콘텍스트 API로 데이터 전달하기` 7:55 부분에서 언급한 내용을 참고하시면 될 것 같아요
setUser 를 setSomeFunc 같은 함수 setter 라고 생각하시면 될 것 같습니다

0

안녕하세요. 함수를 호출하고 싶다는 내용을 제가 잘못봤네요.

다른 컴포넌트에 있는 함수는 export 후 J에서 import하여 사용하면 되지 않던가요?
혹시 함수를 재사용하고 싶으신 경우에는 따로 코드를 분리시켜서 export 후 A, C, J에서
분리시킨 함수를 import해서 사용하는 방법이 있고, redux saga를 사용하여 특정 액션을 호출했을 때
saga middle ware에서 그 함수를 Call 해주는 방법이 있습니다.

아무래도 저도 배우는 입장이니 정확한 답변을 드리긴 힘드네요 ㅠㅠ
함수 구조에 따라 최적화해서 사용하는 방법이 있을 수 있으니 호출하시고 싶은
함수 구조를 코드로 같이 올려두시면 강사님께서 더 좋은 답변 주실거라 생각합니다.

0

아리마님의 프로필 이미지
아리마
질문자

드로우님 안녕하세요.
호출하려는 함수가 Root 에 있다면 말씀하신 부분이 ContextAPI 로도 가능하겠지만
제가 강사님께 문의드린 내용은 A나 C 에 있는 함수를 J 에서 호출하고 싶을 떄이거든요..

Redux 도 강사님이 설명을 잘 해주셔서 활용은 하고 있으나 일단 State 가 아닌 함수의 경우는
어떻게 접근하는 것이 최상일 지 궁금해서 문의드렸습니다. 

아리마님의 프로필 이미지
아리마

작성한 질문수

질문하기