Vue中的組件通信是非常常見的需求，而emit和on是Vue中兩個常用的API。emit用于向父組件觸發自定義事件，而on用于監聽這些自定義事件并執行相應操作。

但是有時候我們需要在觸發自定義事件之后，等待一段時間再執行監聽函數中的操作，這時候就需要使用延遲。Vue提供了Vue.nextTick()方法來實現延遲操作。

// 父組件
<template>
<child-component @custom-event="handleCustomEvent"></child-component>
</template>
<script>
export default {
data() {
return {
message: "hello world"
}
},
methods: {
handleCustomEvent() {
// 等待DOM更新后再執行
this.$nextTick(() => {
console.log(this.message)
})
}
}
}
</script>
//子組件
<template>
<button @click="handleClick">觸發自定義事件</button>
</template>
<script>
export default {
methods: {
handleClick() {
this.$emit("custom-event");
}
}
}
</script>

在這個例子中，當子組件中的按鈕被點擊后，將會觸發父組件中的自定義事件custom-event。在父組件中，handleCustomEvent方法中使用了this.$nextTick()來延遲執行console.log(this.message)。這樣可以保證在DOM更新后再執行相關操作，防止出現錯誤。