在Vue.js框架中,我們可以使用emit()
方法來實現(xiàn)子組件向父組件傳遞數(shù)據(jù)的功能。
首先,在子組件中使用$emit()
方法觸發(fā)父組件的自定義事件:
methods: {
handleClick() {
this.$emit('custom-event', data)
}
}
在父組件中,我們可以通過v-on
指令來監(jiān)聽子組件觸發(fā)的自定義事件,并在回調(diào)函數(shù)中處理傳遞過來的數(shù)據(jù):
<template>
<ChildComponent v-on:custom-event="handleCustomEvent"></ChildComponent>
</template>
<script>
export default {
methods: {
handleCustomEvent(data) {
// 處理傳遞過來的數(shù)據(jù)
}
}
}
</script>
使用$emit()
方法和v-on
指令可以方便地實現(xiàn)組件之間的通信,靈活性很高。
上一篇emit vue
下一篇html 表單必填代碼