Question

我的HelloWorld组件中的这一行的TypeScript不高兴：

this.$refs.test.magic();

“类型'Vue | Element | Vue [] | Element []'不存在属性'magic'。类型“ Vue”不存在属性“ magic”。”

HelloWorld.vue

<template>
  <div>
    <my-component ref="test" />
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
import MyComponent from './MyComponent.vue';
export default Vue.extend({
  name: 'HelloWorld',
  components: { MyComponent },
  props: {
    msg: String,
  },
  mounted() {
    this.$refs.test.magic();
  },
});
</script>

MyComponent.vue

<template>
  <div>
    ...
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
  name: 'MyComponent',
  methods: {
    magic() {
      console.log('works');
    },
  },
});
</script>

我需要某种方法来通知HelloWorld MyComponent的外观，以便它可以了解其中附带的方法。

编辑：我意识到我可以创建一个接口并导出它，但是当我应该能够从MyComponent中提取类型时，不得不创建一个接口感觉很多余。

如何为Vue组件的引用创建类型识别？

0 个答案: