vue3中父组件调用子组件方法

在Vue 3中，父组件可以通过`ref`或`$refs`来访问子组件的实例，并调用其方法。下面是一个示例：

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

<script>
import { ref } from 'vue';
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  setup() {
    const childComponentRef = ref(null);

    const callChildMethod = () => {
      // 通过$refs访问子组件实例，并调用其方法
      childComponentRef.value.childMethod();
    };

    return {
      childComponentRef,
      callChildMethod
    };
  }
}
</script>

在上述示例中，父组件使用`ref`创建了一个引用`childComponentRef`，然后将其绑定到子组件上。通过`$refs`可以访问子组件的实例，在`callChildMethod`方法中，可以通过`childComponentRef.value`来获取子组件的实例，并调用其方法（假设子组件中存在名为`childMethod`的方法）。