$refs define types within component definition

Viewed 87

Let's say I have the below class:

<template>
  <MyCmp ref="myForm" @click="onClickButton" />
</template>

<script>
import { defineComponent } from "vue";
import MyCmp from "@/MyCmp.vue";

export default defineComponent({
  name: "App",
  components: {
    MyCmp,
  },
  methods: {
    onClickButton() {
      // This works, but how can I define this type within this class, so I'm not having to cast it all the time?
      const myForm = this.$refs.myForm as typeof MyCmp;
      console.log(myForm);
    },
  },
});
</script>

I would like to be able to define the types on $refs instead of having to cast the type whenever I use it. I saw this answer, but that doesn't seem to work for me, and I'm thinking it's Vue2 syntax. I couldn't find anything on the official docs for this scenario, so is there a way to do this in Vue3?

0 Answers
Related