vue中監聽組件的生命周期

Vue.js——監聽組件的生命周期

有父組件Parent和子組件Child，如果父組件監聽到子組件掛載mounted就做一些邏輯處理，常規的寫法可能如下：

子組件

export default {
    mounted() {
        this.$emit('listenMounted')
    }
}

父組件

<template>
    <div>
        <List @listenMounted="listenMounted" />
    </div>
</template>

其實還有一種簡潔的方法，使用 @hook 即可監聽組件生命周期，組件內無需做任何改變。同樣的， created 、 updated 等也可以使用此方法。.

<template>
    <List @hook:mounted="listenMounted" />
</template>