vue2 + ts this.$ref 能获取到子组件的值，获取不到方法

您好！对于 Vue 2 + TypeScript 中使用 this.$ref 获取子组件的值是可行的，但无法直接获取子组件的方法。通过 this.$ref 获取的是子组件的实例，您可以通过这个实例访问子组件的属性和数据，但无法直接调用子组件的方法。

如果您希望在父组件中调用子组件的方法，可以通过在子组件上定义一个 ref，并在父组件中通过 this.$refs 访问该 ref，然后调用对应的方法。以下是一个示例：

<template>
  <div>
    <ChildComponent ref="childRef"></ChildComponent>
    <button @click="callChildMethod">调用子组件方法</button>
  </div>
</template>

<script>
import { Vue, Component, Ref } from 'vue-property-decorator';
import ChildComponent from './ChildComponent.vue';

@Component
export default class ParentComponent extends Vue {
  @Ref() readonly childRef!: ChildComponent;

  callChildMethod() {
    if (this.childRef) {
      this.childRef.childMethod();
    }
  }
}
</script>

在这个示例中，我们使用 `@Ref()` 装饰器将子组件的引用声明为 `childRef`，然后在 `callChildMethod` 方法中通过 `this.childRef` 调用子组件的 `childMethod` 方法。

希望能对您有所帮助！如有任何疑问，请随时提问。