v-model 是 Vue.js 經常用到的一個指令，它實現了雙向數據綁定。當表單元素的值發生變化時，視圖會重新渲染，當視圖重新渲染時，會將對應的值設置到表單元素上。

有時候需要將數據從子組件傳遞到父組件，或者是將數據從一個組件傳遞到另一個組件，這時候就需要使用 $emit 和 $on 方法來手動觸發和監聽事件。

// 父組件
<template>
<child-component @custom-event="handleCustomEvent"></child-component>
</template>
<script>
import ChildComponent from './ChildComponent.vue';
export default {
components: {
ChildComponent
},
methods: {
handleCustomEvent(payload) {
console.log(payload);
}
}
}
</script>
// 子組件
<template>
<div>
<button @click="emitCustomEvent">發送自定義事件</button>
</div>
</template>
<script>
export default {
methods: {
emitCustomEvent() {
this.$emit('custom-event', { message: 'Hello, World!' });
}
}
}
</script>

在上面的代碼中，父組件通過 @custom-event 綁定了一個方法 handleCustomEvent，子組件中通過 $emit('custom-event', { message: 'Hello, World!' }) 方法觸發了一個自定義事件，父組件通過監聽自定義事件，從而獲取到子組件傳遞的數據。