Typescript Vue类型脚本子组件方法

我已经使用Vue一段时间了，但是已经开始使用Typescript实现。我遇到了一个问题，无法通过父对象上的引用访问子对象的方法

父代码：

<template>
  <ref-test ref="child"/>
</template>

<script lang="ts">
import Vue from "vue";
import RefTest from "./RefTest.vue";

export default Vue.extend({
  name: "RefParent",
  components: {
    RefTest
  },
  data: () => ({}),
  methods: {},
  mounted() {
    const child = this.$refs.child as RefTest;
    child.pingMe();
  }
});
</script>

<style scoped></style>

从“Vue”导入Vue；
从“/RefTest.vue”导入RefTest；
导出默认Vue.extend({
名称：“RefParent”，
组成部分：{
重新测试
},
数据：（）=>（{}），
方法：{}，
安装的（）{
const child=this.$refs.child作为RefTest；
child.pingMe（）；
}
});

子代码：

<template>
  <div>REF TEST...</div>
</template>

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

export default Vue.extend({
  name: "RefTest",
  data: () => ({}),
  methods: {
    pingMe() {
      console.log("refTest pingMe");
    }
  }
});
</script>

<style scoped></style>

参考测试。。。
从“Vue”导入Vue；
导出默认Vue.extend({
名称：“RefTest”，
数据：（）=>（{}），
方法：{
pingMe（）{
console.log（“refTest pingMe”）；
}
}
});

我看到的问题是，当我使用const

child=this.$refs.child作为RefTest引用子对象时，在父对象中我看到了错误：
“RefTest”指的是一个值，但在这里被用作类型。
。此外，
child.pingMe（）正在报告：
类型“Vue”上不存在属性“pingMe”。

我尝试了这里找到的各种解决方法：主要围绕着inferface定义和
Vue.extend
调用

非常感谢您能帮助我继续思考使用Typescript的不同之处。
好的。做了更多的实验，我不确定这是“正确的”解决方案还是最优雅的解决方案，但代码运行正常，编译器没有抱怨。最终，我创建了一个接口类型，其中包含我试图访问的方法。在父级中，我现在将$ref转换为该接口类型，并且看起来一切正常。请让我知道是否有更好更优雅的方式来做这件事（或者如果这是最好的方式），请参阅下面的完整代码

接口（类型/refInterface.ts）：

家长：

<template>
  <ref-test ref="child" />
</template>

<script lang="ts">
import Vue from "vue";
import RefTest from "./RefTest.vue";
import { RefInterface } from "@/types/refInterface";

export default Vue.extend({
  name: "RefParent",
  components: {
    RefTest
  },
  data: () => ({}),
  methods: {},
  mounted() {
    const child = this.$refs.child as RefInterface;
    child.pingMe();
  }
});
</script>

<style scoped></style>


从“Vue”导入Vue；
从“/RefTest.vue”导入RefTest；
从“@/types/RefInterface”导入{RefInterface}”；
导出默认Vue.extend({
名称：“RefParent”，
组成部分：{
重新测试
},
数据：（）=>（{}），
方法：{}，
安装的（）{
const child=this.$refs.child作为重新接口；
child.pingMe（）；
}
});

“子”代码没有更改，因此没有重新粘贴它。
错误说明了问题所在
RefTest
既不是类型也不是接口，因此不能在需要类型的地方使用。请尝试使用RefTest的类型
。谢谢。我猜我对打字脚本比较新，我不理解这些错误？使用
作为RefTest的类型会产生新的错误<代码>TS2352:将类型“Vue | Element | Vue[]| Element[]”转换为类型“VueConstructor”可能是错误的，因为两种类型都没有充分重叠。如果这是有意的，请先将表达式转换为“未知”。类型“Element[]”缺少类型“VueConstructor”中的以下属性：extend、nextTick、set、delete和其他8个属性。
<template>
  <ref-test ref="child" />
</template>

<script lang="ts">
import Vue from "vue";
import RefTest from "./RefTest.vue";
import { RefInterface } from "@/types/refInterface";

export default Vue.extend({
  name: "RefParent",
  components: {
    RefTest
  },
  data: () => ({}),
  methods: {},
  mounted() {
    const child = this.$refs.child as RefInterface;
    child.pingMe();
  }
});
</script>

<style scoped></style>