1. 부모의 데이터를 수정하려면 custom event를 써야됨
$emit() 등
2. 자식에서 $emit()을 쓰면 부모에게 메시지를 보낼 수 있다.
부모는 @ 기호로 받아서 처리하면 된다.
<!-- 자식 -->
<button @click="$emit('closeModal')">Close</button>
<!-- 부모 -->
<modal @closeButton="isOpen = false" :isOpen="isOpen"/>
3. 자식이 부모에게 $emit()을 보낼 때 데이터도 함께 보낼 수 있다.
부모는 $event로 받아서 처리하면 된다.
<!-- 자식 -->
<button @click="$emit('closeModal', 1234)">Close</button>
<!-- 부모 -->
<modal @closeButton="isOpen = false; var recvData = $event" :isOpen="isOpen"/>
반응형
'Knowledge Wiki > Vue.js' 카테고리의 다른 글
Vue.js v-model (0) | 2021.12.03 |
---|---|
Vue.js input 태그 (0) | 2021.12.03 |
Vue.js props (0) | 2021.12.03 |
Vue.js 컴포넌트 (0) | 2021.12.03 |
Vue.js if문 (0) | 2021.12.03 |