emit方法:方法在父,触发在子
子:触发
// 子:
<script setup lang="ts">
const emit = defineEmits<{
(e: "selectHandle", v: string): void;
(e: "selectHandleWith", v: SelectObject): void;
}>();
const selectChange = (val: string) => {
const data = options.value.find(item => item.value === val);
if (data) {
emit("selectHandle", val);
emit("selectHandleWith", data);
}
};
</script>
<template>
<el-select
style="width: 100%"
v-model="selectValue"
:size="size"
:disabled="disabled"
filterable
remote
reserve-keyword
placeholder="请输入工号或姓名搜索"
:remote-method="remoteMethod"
:loading="loading"
@change="selectChange"
>
<el-option
v-for="item in options"
:key="item.value"
:label="`${item.label}/${item.value}`"
:value="item.value"
/>
</el-select>
</template>
父:调用
父:
<script setup lang="ts">
const onInputHandle = val => {
follower.FollowerJobNunber = val.value;
follower.FollowerName = val.label;
};
</script>
<template>
<div>
<el-table
:data="list"
size="small"
:header-cell-style="{ background: '#f5f7fa' }"
border
>
<el-form-item label="跟进人" prop="FollowerJobNunber">
<EmployeeSearch
:validate-event="false"
:label="follower.FollowerName"
:value="follower.FollowerJobNunber"
@selectHandleWith="onInputHandle"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="onSubmit"
>确定</el-button
>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>