title: Vue.js pass form data (v-model) values from Parent to Child?
body: <p>I have a two component form using vue.js where the parent form starts the multistep process and collects two inputs using v-model and if these are valid values the form moves to the next component of the form using a child component. What I would like to do is take the parent 2 values and append them to the child component formData object for submission. Is there a way to pass the values to the child component? I'm assuming props but not sure how to just pass values and not $emit a function.</p>
  <p>Parent:</p>
  <pre><code> &lt;div class=&quot;row--flex&quot;&gt;
              &lt;input type=&quot;text&quot; class=&quot;form-input text-input center-margin&quot; name=&quot;deductibleCardId&quot; id=&quot;deductibleCardId&quot; v-model=&quot;$v.formData.deductibleCardId.$model&quot; /&gt;
    
         &lt;input type=&quot;text&quot; class=&quot;form-input text-input center-margin&quot; name=&quot;savingsCardId&quot; id=&quot;savingsCardId&quot; v-model=&quot;$v.formData.savingsCardId.$model&quot; /&gt;
          &lt;/div&gt;
  
  //child component call
   &lt;GetCard v-if=&quot;showDemographics&quot; :is-sub-form=&quot;true&quot; @submit=&quot;submitDemographics&quot; /&gt;
  
   data() {
      return {
        formData: {
          hasCard: null,
          deductibleCardId: null,
          savingsCardId: null
        }
    }
  </code></pre>
  <p>Child Component form data:</p>
  <pre><code>const formData = new FormData()
  
          formData.append('method', 'activate')
  
          (have these two values be brought over from parent values)
  
          formData.append('card_hd', this.formData.deductibleCardId)
          formData.append('card', this.formData.savingsCardId)
  </code></pre>