I have two components, parentComponent and childComponent.

parentComponent passes a prop called booleanValue to childComponent whose value is used inside the nextTick() callback to perform some processing.

My child component is performing its method likeso:

mounted() {
this.$nextTick(()=>{
      if (this.booleanValue){
        alert('You got it!')
        this.$emit('event-name');
      }
    })
  }
}

and my parent component processes it like so:

<child-component 
    v-on:event-name=eventMethod
    v-bind:booleanValue=this.booleanValue>
</child-component>

and my eventMethod() is described under methods: {...}

My code is syntactically correct but I can't get the nextTick to perform it in the way I want to. What I'm trying to achieve is that the child component would finish rendering the new DOM and then emit an event back to the parent who then does some other processing.

What am I doing wrong? I would prefer to use this solution instead of attempting to solve via other implementations like the Options API, if possible. I haven't learned that yet and I fear I'll be introducing more frustration if I try to learn it now for this one problem.