기록이 힘이다.

[Emits] 자식 컴포넌트는 부모로부터 이벤트를 발송할 수 있다. 본문

Vue

[Emits] 자식 컴포넌트는 부모로부터 이벤트를 발송할 수 있다.

dev22 2024. 1. 30. 21:11
728x90

https://ko.vuejs.org/tutorial/#step-13

 

Vue.js

Vue.js - The Progressive JavaScript Framework

vuejs.org

<script setup>
import { ref } from 'vue'
import ChildComp from './ChildComp.vue'

const childMsg = ref('자식 컴포넌트로부터 아직 메시지를 받지 못했어요!')
</script>

<template>
  <ChildComp  @response="(msg) => childMsg = msg"/>
  <p>{{ childMsg }}</p>
</template>

emit()의 첫 번째 인자는 이벤트 이름입니다. 이후 추가되는 모든 인자는 이벤트 리스너에 전달됩니다.

<script setup>
const emit = defineEmits(['response'])

emit('response', '자식 컴포넌트로부터 🌷를 받았어요!')
</script>

<template>
  <h2>자식 컴포넌트</h2>
</template>