EMIT
-
[Composition API] Vue3 Emit 사용하기(script setup)Frontend/Vue3 2022. 12. 31. 18:51
1. 사용 배경 Emit는 하위 컴포넌트(자식)에서 상위 컴포넌트(부모)로 이벤트로 데이터를 넘겨줄 경우 사용합니다. 2. 파일 구조 프로젝트 파일 구조 독자분들의 이해를 돕기 위해 프로젝트 생성 시 자동으로 구성되는 프로젝트 구조를 그대로 사용하겠습니다. 3. 구현 과정 (App.vue와 main.js 파일은 전혀 손대지 않았습니다.) 자식 컴포넌트인 HelloWorld.vue 파일부터 보겠습니다. //HelloWorld.vue Submit 버튼을 클릭하면 "data"가 이벤트로 전달되는 로직입니다. 페이지에 Submit 버튼을 누르면 부모 컴포넌트로 데이터가 넘어갑니다. //HomeView.vue @submit을 통해 하위 컴포넌트에서 넘어오는 데이터를 받아 emitTest 함수의 파라미터 값으로 전..