VUEJS Listen lifecycle hook from the child component

Here's a very useful tip I learnt from Vuedose.

In some cases I needed to know when a component has been created, mounted or updated from a parent component.

So you already tried something like this

    <Child @mounted="doSomething"/>.

Let me tell you this: It will not work ˆˆ.

Instead, the solution is as simple as listening to an event with the lifecycle hook name, prefixed by @hook:.

    <Child @hook:mounted="childMounted"/>

If you dont trust the tip check the yourself in this CodeSandbox

Thank's to Vuedose for this tip. Go check their website and sign to the newsletter 😄

Comments

[Juan P. Prieto]

thanks for sharing! worked great.

[Alex P]

Does this work with Vue 3?

[Alex P]

Found the answer here: github.com/vuejs/core/issues/3178

[florent giraud]

It was when vue3 was not here in my article thanks for sharing the issue :)