えぐろぐ

https://twitter.com/eggpogg

Nuxt x TypeScript でVuetifyのComponentのメソッドの呼び出し方

VuetifyがまだTypeScriptに対応していない状態なので、
自分でVFormのinterfaceを作成をして、$refsの値をキャストすることで使用できる。

<template>
  <div>
    <v-form ref="form"></v-form>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'

interface VForm extends Vue {
  reset(): void
  resetValidation(): void
  validate(): boolean
}

export default Vue.extend({
  mounted() {
    const form = this.$refs.form as VForm
    form.reset()
  },
})
</script>

使用できる関数は公式サイトを見るか vuetifyjs.com

実際にコードを見るか github.com

参考 github.com