vue3子调用父组件方法

要在子组件中调用父组件的方法，可以借助Vue.js提供的事件系统。具体而言，可以使用$emit方法向父组件发送一个自定义事件，并在父组件中通过@事件名来监听该事件，从而执行对应的方法。

以下是一个示例代码：

// 父组件
<template>
<div>
<h1>我是父组件</h1>
<ChildComponent @child-click="handleChildClick" />
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue'

export default {
components: {
ChildComponent,
},
methods: {
handleChildClick() {
console.log('子组件点击了按钮')
},
},
}
</script>

// 子组件
<template>
<div>
<h2>我是子组件</h2>
<button @click="handleButtonClick">点击我触发父组件方法</button>
</div>
</template>
<script>
export default {
methods: {
handleButtonClick() {
this.$emit('child-click')
},
},
}
</script>

在上面的代码中，子组件中的handleButtonClick方法通过this.$emit('child-click')向父组件发送了一个名为child-click的自定义事件。父组件中的ChildComponent组件通过@child-click来监听该事件，并在handleChildClick方法中执行对应的逻辑。