vue3+vant文件上传 编辑时反显和新增时遇到的问题

刚开始拿到后端返的图片路径 直接拼接后按官网绑定给url 再次新增图片后无法显示 并且无法上传

<van-uploader v-model="fileList" :after-read="afterRead" multiple />

let url={};
url.url='http://39.101.135.159:8060/trans/company/getImage?imageName='+bdDetail;//bdDetail为业务字段
fileList.push(url)

这样能反显 但是再次新增时 无法显示新增的图片 打印fileList发现 反显的是地址连接 新增的是带有file,content,name的对象 。
解决方法：将图片转为base64,和file文件 再push到fileList。具体代码如下：

let url='http://39.101.135.159:8060/trans/company/getImage?imageName='+bdDetail;
            let homeImage = new Image(); 
            homeImage.src = url;
            homeImage.onload = function () {
            let canvas = document.createElement("canvas");
            canvas.width = homeImage.width;
            canvas.height = homeImage.height;
            let context = canvas.getContext("2d");
            context.drawImage(homeImage, 0, 0, homeImage.width, homeImage.height);
            let quality = 0.8;
            let dataURL = canvas.toDataURL("image/png", quality);

            let arr = dataURL.split(',')
            let mime = arr[0].match(/:(.*?);/)[1]
            let bstr = atob(arr[1])
            let n = bstr.length
            let u8arr = new Uint8Array(n)
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n)
            }
            let b= new File([u8arr], 'pic.png', {
                type: mime
            })
            let need={content:dataURL,file:b};
            fileList.value.push(need)

这样反显的图片和新增的图片都为一种格式 亲测有效