title: Using vue-js-modal how do I pass data back up to the parent component
body: <p><a href="https://github.com/euvl/vue-js-modal#readme" rel="nofollow noreferrer">https://github.com/euvl/vue-js-modal#readme</a></p>
  
  <p>I have searched through the docs and can't find an example that fits my needs.
  I have also searched through stack overflow without finding an example that matches mine.</p>
  
  <p>I am strictly asking about the interactions between the parent and modal component here. You can assume all of my imports are correct. I have omitted some code for brevity ( for example the template is redundant on Component A ). You can assume open is being triggered via a click handler.</p>
  
  <p>I have a component: A</p>
  
  <pre><code>{
      data() {
          return {
              data: ''
          }
      },
      methods: {
          open() {
              this.$modal.show(ComponentB, { data: this.data }, {}, { 'before-close': update })
          },
          update(e) {
              // e = event
              // this.data is not changed
          }
      }
  }
  
  </code></pre>
  
  <p>Component B</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          &lt;input v-model="$attrs.data" /&gt;
          &lt;button @click="$emit('close')"&gt;close&lt;/button&gt;
      &lt;/div&gt;
  &lt;/tempate&gt;
  </code></pre>
  
  <p>As you can see <code>Component A</code> passes its data prop into the <code>ComponentB</code> via vue-js-modal, the input is in turn is bound via <code>v-model</code> back to that attribute.</p>
  
  <p>Why when I change this attribute does it not change on the parent component.</p>
  
  <p>What is the correct way to pass data down and back up through the modal component.</p>
  
  <p>Also. My requirement is to use dynamic modals in this style. NOT to use the template syntax with JSX.</p>