[Vuejs]-Vue – Form component with child input component

0👍

You will want to use dynamic props to update the child from the parent. From their documentation:

Whenever the data is updated in the parent, it will also flow down to the child

Something like:

<template lang="pug">
    form
       MyCustomInput(v-bind:inputValChild="inputValue" v-on:emitMethod="parentEmitMethod")
         button(@click.prevent="send")
</template>

And then declare inputValChild as a prop in your child component.

👤Eric G

0👍

I would do it this way:

handle () : {
  this.$emit('emitMethod', {
    param: this.inputValChild,
    callback: this.clearNow)
  }

And in the parent component I would simply call “callback()” after finishing.
The method clearNow would do the job in the child’s component. But there are also other ways. Most important that you keep it consistent in the project and do not mix everything.

Leave a comment