I'm using Vue 2 with a TypeScript layer (vue-property-decorator).
I have a class called BaseForm in a .vue file:
<template>
<div class="base-form">
<form>
<slot />
</form>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
@Component({})
export default class BaseForm extends Vue {
comment = '';
}
</script>
I want to access the comment variable of the BaseForm class in a .ts file like so:
import BaseForm from '@/components/BaseForm.vue';
setComment(form: BaseForm, comment: string) {
form.comment = comment;
}
But in the .ts file the BaseForm is not typed as class but as (Vue) interface and I can not access the variable.
My shims-vue.d.ts looks like (I got that from here):
declare module '*.vue' {
import Vue from 'vue';
export default Vue;
}
I tried to add something like this (but it did not work):
declare module 'BaseForm.vue' {
import BaseForm from '@/components/base/BaseForm.vue';
export default BaseForm;
}
Any advice how to use a class in a non-vue file?
.tsfile as the plain.tsfile loads every class asinterface Vuewhich in return does not provide such a variable.