250x250
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- SQL쿡북
- 인프런김영한
- 자바예외
- 자료구조
- 알고리즘
- 인덱스
- MariaDB
- 인프런백기선
- 네트워크
- 자바
- 이팩티브 자바
- AWS RDS
- aop
- 클린코드
- mysql
- java
- 스프링부트와AWS로혼자구현하는웹서비스
- 이펙티브 자바
- react
- AWS
- 알고리즘분석
- vue.js
- 자바스터디
- 도메인 주도 개발 시작하기
- 이펙티브자바
- 기술면접
- DDD
- 혼공SQL
- CleanCode
- jpa
Archives
- Today
- Total
기록이 힘이다.
[Emits] 자식 컴포넌트는 부모로부터 이벤트를 발송할 수 있다. 본문
728x90
https://ko.vuejs.org/tutorial/#step-13
<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>
'Vue' 카테고리의 다른 글
Vue JS returning [Object object] on console.log and Undefined on JSON.parse / agGrid param [Object object] (1) | 2024.02.28 |
---|---|
[슬롯] 템플릿 조각을 전달 (0) | 2024.01.30 |
[Props] 자식 컴포넌트는 props를 통해 부모로부터 데이터를 받을 수 있습니다. (0) | 2024.01.30 |
[감시자] 때때로 우리는 반응형 "사이드 이펙트"를 수행 (0) | 2024.01.30 |
[생명주기와 템플릿 참조] 필연적으로 DOM을 수동으로 작업해야 하는 경우 (0) | 2024.01.30 |