vue开发中中父子组件的相互调用是常见的使用功能，通过对于定义的大量组件可以极大程度的提升开发者的效率。还能在后期的维护中更为便捷。

本篇文章就来介绍uni-app基于vue3+setup如何使用emits实现子组件调用父级组件定义方法。

一、vue3+setup父级页面及方法定义

//页面
<template>
	<view>
		<testBox  @testClick="testClick" />
	</view>
</template>
//js
<script setup lang="ts">
	import testBox from "@/components/test.vue"
	const testClick = () => {
		console.log(e)	
	}
</script>

二、vue3+setup子组件中配置如下

//页面
<template>
	<view>
		<view @click="sureClick">测试</view>
	</view>
</template>
//js
<script setup lang="ts">
	const emits = defineEmits(['testClick']);
	const sureClick = () => {
		emits('testClick',"六月初技术站")
	}
</script>

点击“测试”后，调试栏打印结果为：六月初技术站

defineEmits:子组件向父组件事件传递