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

在Vue 3中，子组件可以通过事件机制调用父组件的方法。具体步骤如下：

1. 在子组件中注册事件。在子组件需要调用父组件方法的地方，使用`$emit`方法注册一个自定义事件，并传递需要传递给父组件的参数。

2. 在父组件中引入子组件，并在子组件上监听注册的事件。使用`@`符号绑定子组件的自定义事件，并指定要调用的父组件方法。

下面是一个示例代码：

<!-- 子组件 -->
<template>
  <button @click="callParentMethod">调用父组件方法</button>
</template>

<script>
export default {
  methods: {
    callParentMethod() {
      this.$emit('custom-event', '参数1', '参数2');
    }
  }
}
</script>

<!-- 父组件 -->
<template>
  <div>
    <p>父组件方法被调用的次数：{{ count }}</p>
    <child-component @custom-event="parentMethod"></child-component>
  </div>
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      count: 0
    }
  },
  methods: {
    parentMethod(param1, param2) {
      this.count++;
      console.log('父组件方法被调用', param1, param2);
    }
  }
}
</script>

在上面的示例中，子组件中的按钮被点击时，会调用`callParentMethod`方法，并通过`$emit`方法触发了一个名为`custom-event`的自定义事件，并传递了两个参数。父组件中监听了该自定义事件，并在`parentMethod`方法中接收到了子组件传递的参数。