Just checking if I'm using $refs properly

[goblinfactory]

I need to add a "close" button onto the standard feedback.nue dialog that comes with the getting started blog.
I am calling a web api, and I created a fun error page, (see screenshot below) if there's any errors.

In order to wire the @click handler on the <button> to close the dialog, i'm having to use $refs as follows; My question is whether the pattern of saving the refs on mounted so that I can use them later is idiomatic and what was intended?

I suspect we might want to let Nuejs make this easier for us and I can think of a number of ways we can do that, but at least ...for now, while we dont have that, just wanted to make sure I'm not missing out a simpler (better) way to do this than what I'm doing below that is already supported by NueJs as-is.

This feels like I'm not using Nue properly.

<dialog ref="mydialog" ... >
  ...
   <div :if="dialogStatus=='error'" class="dialogError">
    <h2>Oops!</h2>
    <p>There was a problem submitting your feedback.</p>
    <button @click="closeError()">close</button>
    <p>{errorText}</p>
  </div>

<script>

// save the dialog's reference after component has mounted
_mydialog = null
mounted() { 
  this._mydialog = this.$refs.mydialog
 }
 
 // close called by the close button, using the $ref we saved on mount.
 closeError() { 
  this._mydialog.close()
 }