场景: el-form中有多个upload上传组件,多个回调显然会冗余
解决方案:根据el文档给出的回调自定义一个方法
<el-form-item label="店铺logo" prop="logo">
<el-upload
class="avatar-uploader"
:action="action"
:show-file-list="false"
:headers="uploadHeaders"
:on-change="
function (uploadFile : UploadFile, uploadFiles:UploadFile[]) {
return handleAvatarSuccess(uploadFile, uploadFiles, 'logo');
}
"
>
<img
v-if="formMerchant.logo"
:src="formMerchant.logo"
class="avatar"
/>
<el-icon class="avatar" v-else><i-ep-plus /></el-icon>
</el-upload>
</el-form-item>
核心代码:编写一个自定义方法将原有方法回调接收,传入自己需要的标识符进行判断处理
:on-change="
function (uploadFile : UploadFile, uploadFiles:UploadFile[]) {
return handleAvatarSuccess(uploadFile, uploadFiles, 'logo');
}
"