이전 포스트에서 부모 컴포넌트에서 자식 컴포넌트로 값(데이터)을 전달하기 위해서 props를 사용하는 것에 대해서 살펴보았다. 이번에는 props와 유사하지만 값이 아닌 html markup을 전달하려는 경우에 필요한 slot이라는 것에 대해서 살펴보자. slot의 필요성props를 통해서 부모 컴포넌트에서 자식 컴포넌트로 전달할 수 있는 것은 JavaScript의 타입(String, Number, Object, ...)의 데이터 들이다. 전달받은 데이터를 어떻게 사용할지(computed로 하건, local 변수에 할당하건, 스타일을 어떻게 적용하건)는 오롯이 자식 컴포넌트의 몫이다.그런데 만약 html markup이 전달된다면 어떨까? 문자를 파싱해서 어떤 태그인지 확인해야 하고 태그 중간에 데이터..
[vue 3] 06. 컴포넌트간 통신 - slot
이전 포스트에서 부모 컴포넌트에서 자식 컴포넌트로 값(데이터)을 전달하기 위해서 props를 사용하는 것에 대해서 살펴보았다. 이번에는 props와 유사하지만 값이 아닌 html markup을 전달하려는 경우에 필요한 slot이라는 것에 대해서 살펴보자. slot의 필요성props를 통해서 부모 컴포넌트에서 자식 컴포넌트로 전달할 수 있는 것은 JavaScript의 타입(String, Number, Object, ...)의 데이터 들이다. 전달받은 데이터를 어떻게 사용할지(computed로 하건, local 변수에 할당하건, 스타일을 어떻게 적용하건)는 오롯이 자식 컴포넌트의 몫이다.그런데 만약 html markup이 전달된다면 어떨까? 문자를 파싱해서 어떤 태그인지 확인해야 하고 태그 중간에 데이터..
2023.09.02