vue3的父组件怎么调用子组件的方法

在Vue 3中，你可以使用`ref`和`app`来获取子组件实例，并调用其方法。以下是一个示例：

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

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

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

    // 在组件挂载后，将子组件实例赋值给ref
    onMounted(() => {
      childComponentRef.value = childComponentRef.value.$refs.childComponent;
    });

    const callChildMethod = () => {
      // 调用子组件的方法
      childComponentRef.value.childMethod();
    };

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

在父组件中，我们通过`ref`创建了一个`childComponentRef`的引用，并在组件挂载后将子组件实例赋值给它。然后，我们可以使用`childComponentRef.value`来访问子组件实例，并调用其方法，如`childComponentRef.value.childMethod()`。

需要注意的是，在Vue 3中，我们使用`setup()`函数来编写组件逻辑，而不再使用传统的选项式API。在`setup()`函数中，我们返回一个包含需要暴露给模板的数据和方法的对象。

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