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

在Vue3中，父组件想要调用子组件的方法，通常通过props向下传递一个函数给子组件作为props，然后在子组件内部暴露这个函数供父组件调用。这是一种常见的父子通信方式，称为“自定义事件”或者“方法绑定”。

例如，假设有一个`ChildComponent.vue`子组件，它有一个名为`sendData`的方法：

<template>
  <button @click="emitData">点击发送数据</button>
</template>

<script>
export default {
  methods: {
    sendData() {
      this.$emit('parentMethod', '数据从子组件');
    }
  }
}
</script>

在父组件`ParentComponent.vue`里，可以这样接收并调用这个方法：

<template>
  <ChildComponent :customMethod="callChildMethod" />
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: { ChildComponent },
  methods: {
    callChildMethod(data) {
      console.log(`收到的数据：`, data);
    }
  }
}
</script>

当用户点击子组件的按钮时，会触发`sendData`方法，从而调用父组件的`callChildMethod`方法，并将数据传递给它。