title: Send data variable from child to parent using vuejs
body: <p>I have a modal component (child called <code>modal_form.vue</code>), which I call inside another component called <code>index.vue</code></p>
  <p>I would like to send a data variable from <code>modal_form.vue</code> to <code>index.vue</code>.</p>
  <p>Can someone give me an example?</p>
  <p>PS: <code>modal_form</code> contains an axios request, so I would like to send the response to <code>index.vue</code></p>
  <p><strong>-- modal --</strong></p>
  <pre class="lang-js prettyprint-override"><code>methods: {
      post() {
          getAPI.post('api/contact/', this.form)
          .then(response =&gt; (this.data = response.data))
          .then(() =&gt; (this.$emit('dataLoaded', this.data)))
          .catch(error =&gt; console.log(error.response))
      }
  }
  </code></pre>
  <p><strong>-- index --</strong></p>
  <pre class="lang-js prettyprint-override"><code>&lt;addContactModal v-if=&quot;openContactModal&quot; :dataLoaded=&quot;refreshContactList&quot;&gt;&lt;/addContactModal&gt;
  
  data: function(){
      return {
          openContactModal: true,
          contacts: []
      }
  },
  methods: {
      refreshContactList(data){
          this.contacts = JSON.parse( JSON.stringify( data ) )
      },
  }
  </code></pre>