Vue.js是一款流行的開源JavaScript框架，它提供了許多方便的工具和功能，使開發人員可以更輕松地構建現代Web應用程序。其中一個特別有用的功能就是組件，它允許我們將網頁拆分成更小的可重用部分。有時在組件之間進行通信是必要的，而Vue提供了幾種不同的方式，包括子組件emit。
子組件emit是Vue中的一種特定方式，它允許子組件向父組件傳遞數據。當子組件觸發一個特定的事件時，emit方法將傳遞給父組件。父組件可以監聽這個事件并執行適當的操作。
// 子組件
Vue.component('ChildComponent', {
methods: {
onClick: function() {
this.$emit('my-event', 'Hello from child')
}
},
template: ''
})
// 父組件
new Vue({
el: '#app',
data: {
message: ''
},
methods: {
onMyEvent: function(message) {
this.message = message
}
},
template: '{{ message }}
'
})在上面的例子中，我們定義了一個名為ChildComponent的子組件。當按鈕被單擊時，執行onClick方法并觸發一個名為my-event的自定義事件。
在父組件中，我們通過使用v-on指令來監聽my-event事件。我們定義一個名為onMyEvent的方法，該方法將會在事件觸發時被調用。它接收一個字符串參數，將這個參數存儲在父組件的message變量中。
接下來，我們在父組件的模板中創建一個ChildComponent實例。我們使用v-on指令來將onMyEvent方法綁定到my-event事件上。我們還創建了一個帶有message變量的文本段落，它將顯示子組件傳遞的消息。
如果在子組件中有需要向父組件傳遞數據的事件，我們可以使用$emit方法。
在子組件中，我們調用$emit方法并傳遞事件名稱和所需數據。在父組件中，我們可以使用v-on指令并將事件名稱綁定到一個方法上，這個方法將會在子組件觸發事件時被調用，并傳遞子組件傳遞的數據。
使用子組件emit的好處是它允許我們在任何時候都可以從子組件中向父組件傳遞數據，而不必依賴非常嚴格的組件層次結構。通過使用emit方法，我們可以創建重復使用的組件，并根據需要將其包裝在不同的容器組件中。