使用得vue3中defineEmit函数
在 Vue 3 的 Composition API 中，
defineEmits是一个函数，用于在 setup 函数中明确地声明一个组件可以触发的自定义事件。这有助于提供更好的类型检查和更清晰的组件接口。当你使用 Vue 3 的
<script setup>语法糖时，defineEmits尤其有用，因为它可以与 TypeScript 一起使用，以提供类型化的事件发射。
现实中得例子
父级页面代码
<template>
<div class="service-contaienr">
<el-form :inline="true" :model="params" class="demo-form-inline">
<el-form-item label="姓名" prop="name">
<el-input v-model="params.nameSearch" placeholder="请输入姓名" />
</el-form-item>
<el-form-item label="职称">
<el-input v-model="params.jobTitle" placeholder="请输入职称" />
</el-form-item>
<el-form-item>
<el-button icon="Search" plain type="primary" @click="obscureSearch"
>搜索</el-button
>
<el-button icon="Refresh" @click="resetHandle(formTest)"
>重置</el-button
>
<el-button icon="CirclePlus" type="primary" @click="createServiceHandle"
>新增</el-button
>
</el-form-item>
</el-form>
<el-table :data="serviceList" style="width: 100%">
<el-table-column align="center" label="序号" prop="index" width="60" />
<el-table-column align="center" label="人才姓名" prop="name" width="180"/>
<el-table-column align="center" label="职称" prop="jobTitle" />
<el-table-column align="center" label="工作单位" prop="employer" />
<el-table-column align="center" label="研究方向" prop="researchDirection" />
<el-table-column align="center" label="关联产业" prop="relatedIndustries" />
<el-table-column align="center" label="综合评价分数" prop="evaluationScore" />
<!-- 没有审核中的状态 暂时未做判断 -->
<el-table-column align="center" label="操作" prop="name">
<template #default="scope">
<el-text class="mx-1" type="primary" @click="detailService(scope.row)">详情</el-text>
<el-text class="mx-1" type="primary" @click="editService(scope.row)" >编辑</el-text>
<!-- <el-text class="mx-1" type="danger" @click="deleteServiceItem(scope.row)" >删除</el-text> -->
</template>
</el-table-column>
</el-table><el-dialog
v-model="dialogVisibleService"
:title="text"
width="40%"
align-center
destroy-on-close
@close="handleClose"
>
<div class="dialog-box">
<el-scrollbar>
<el-form
ref="service"
:model="serviceForm"
:rules="rules"
label-width="100px"
>
<el-row style="padding: 0.1rem 0.2rem 0">
<el-col :span="24">
<el-form-item label="个人风采" prop="avatar">
<imageCut
v-model="serviceForm.avatar"
:fixedNumber="[86, 114]"
:disabled="disabled1"
@getlist="getListData($event)"
@send="sendData"
>
</imageCut>
</el-form-item>
<el-form-item label="姓名" prop="name">
<el-input
v-model="serviceForm.name"
:disabled="disabled1"
/>
</el-form-item>
<el-form-item label="职称" prop="jobTitle">
<el-input
v-model="serviceForm.jobTitle"
:disabled="disabled1"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="身份证号" prop="idCard">
<el-input
v-model="serviceForm.idCard"
:disabled="disabled1"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="所在地区" prop="area">
<!-- <el-select
v-model="serviceForm.province"
placeholder="请选择省份"
@change="cityData"
:disabled="disabled1"
style="width: 100%;"
>
<el-option
v-for="province in provinceOptions"
:key="province.value"
:label="province.value"
:value="province.value"
/>
</el-select> -->
<el-select
v-model="serviceForm.area"
placeholder="请选择地区"
:disabled="disabled1"
style="width: 100%;"
>
<el-option
v-for="area in cityOptions"
:key="area.value"
:label="area.value"
:value="area.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="关联产业" prop="productCategoryId">
<!-- <el-select
v-model="serviceForm.productCategoryId"
placeholder="请选择一级产业"
@change="productTwoData"
:disabled="disabled1"
style="width: 40%; margin-right:5px"
>
<el-option
v-for="product in productFirstOptions"
:key="product.value"
:label="product.text"
:value="
