Element Plus自动上传el-upload转化base64模式

<template>
<div class="">
<el-upload class="avatar-uploader" 
       :http-request="upimage" :show-file-list="false">
           <img v-if="imageUrl" :src="imageUrl" class="avatar" />
            <el-icon v-else class="avatar-uploader-icon">
             <Plus />
             </el-icon>
    </el-upload>
</div>
</template>
<script setup lang="ts">
import { ref, reactive } from "vue"
import { getupload } from "../../api/source"
const imageUrl = ref<any>("")
// 上传图片
const upimage = (file: any) => {
    console.log(file);
    // // getupload().then(res=>{})
    getBase64(file.file).then(res => {
        console.log(res);
        let data = {
            imgurl: res
        }
        console.log(data);
       //封装的axios
        getupload(data).then(red => {
            let url = "https://testshool.zzgoodqc.cn/"
            imageUrl.value = url + red.data.data.url


        })

    })
}
const getBase64 = (file: any) => {
    return new Promise((resolve, reject) => {
        let reader = new FileReader();
        let fileResult = ref<any>("");
        reader.readAsDataURL(file);
        reader.onload = function () {
            fileResult.value = reader.result;
        };
        reader.onerror = function (error) {
            reject(error);
        }
        reader.onloadend = function () {
            resolve(fileResult.value)
        }
    })
}


</script>