title: Vue & Quasar - Sharing a custom dialog component
body: <p>I've looked at <a href="https://stackoverflow.com/questions/58557479/reuse-quasar-dialog-plugin-with-custom-component-on-another-component">Reuse Quasar Dialog plugin with custom component on another component</a> that does not have any answers and I have close to the same question but I have structured code a bit different.  On my parent form I have</p>
  
  <pre><code>        &lt;q-dialog prevent-close v-model="showProfileForm" class="profileDialog"&gt;
          &lt;profile-dialog&gt;&lt;/profile-dialog&gt;
          &lt;/q-dialog&gt; 
  </code></pre>
  
  <p>and my profile-dialog is a form that is a simple template </p>
  
  <pre><code>         &lt;template&gt; 
              &lt;q-stepper
  </code></pre>
  
  <p>It seems that if I wrap the component on the parent page the dialog will open BUT I cannot pass in</p>
  
  <pre><code>      prevent-close 
  </code></pre>
  
  <p>or add a </p>
  
  <pre><code>       @hide
  </code></pre>
  
  <p>I need to know when the dialog form is closed to save changes or prevent closing unless a button is clicked.  Even adding the prevent-close in the parent does not work</p>
  
  <pre><code>   &lt;q-dialog prevent-close v-model="showProfileForm" class="profileDialog"&gt;
     &lt;profile-dialog&gt;&lt;/profile-dialog&gt;
     &lt;/q-dialog&gt; 
  </code></pre>
  
  <p>If I create the form inside a q-dialog, so it becomes a dialog inside a dialog and set the v-modal to true when it closes the parent form still has the slight gray overlay until the page is clicked and the form will not open a second time </p>