복잡한 컴포넌트구조에서의 통신도 동일한 방식인가요?

Question

본 강의까지만 수강하고 뒷부분에 이어서 나올지는 모르지만 궁금해서 참지못하고 바로 질문드립니다 본 강의에 나온 예제에는 상위컴포넌트 하나에 하위컴포넌트 두개만 있는 구조인데 혹시 실무같은데서 더욱 복잡한 구조일때에도 통신을 할때에 상위컴포넌트로 이벤트를 전달하고 또 상위컴포넌트로 이벤트를 전달하고 그런 방식인가요? 아니면 복잡한 구조에서는 반복없이 한번에 최상위 컴포넌트로 이벤트를 전달하는 그런 방법이 있는건가요?

captain · Answer

안녕하세요, 좋은 질문이네요. 질문하신 건 컴포넌트 설계 영역인거 같아요. 이후에 컴포넌트 개수가 많아지면 상태 관리 라이브러리를 별도로 써서 문제를 해결하기도 합니다. 강의 내용 따라가시다 보면 다 설명이 될거예요 :)

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴이에요. 복잡한 컴포넌트 구조에서도 기본적으로는 상위 컴포넌트에서 하위 컴포넌트로 이벤트를 전달하고, 다시 상위 컴포넌트로 이벤트를 전달하는 방식으로 통신을 합니다. 하지만 이런 방식으로 계속해서 이벤트를 전달하다 보면 컴포넌트 구조와 관련된 복잡성이 증가할 수 있습니다. 이러한 문제를 해결하기 위해 상태 관리 라이브러리를 활용하는 방식도 있습니다. 예를 들어 Vue.js에서는 Vuex 라이브러리를 사용하여 전체 애플리케이션의 상태를 한 곳에서 관리할 수 있습니다. 이를 통해 컴포넌트 간의 데이터 공유가 수월해집니다. 하지만 복잡한 컴포넌트 구조에서도 기본적으로는 상위 컴포넌트에서 하위 컴포넌트로 이벤트를 전달하는 방식으로 통신한다는 점은 동일합니다. 더 많은 정보를 얻고 싶으시다면 Vue.js 공식 문서의 관련 내용을 참고해보시기를 추천합니다. 감사합니다.