Vue中,Iview的Upload 组件无法获取本地图片的绝对路径,请问有什么办法解决,我要实现裁剪上传,需要绝对路径

如题所示 Iview的 的 Upload 中,只有file.name ,能获取到文件名,我又尝试了file.path,结果为空,求帮助,怎么解决无法获取本地图片的绝对路径

还有个小问题,就是Iview Upload 中 实例中的 file ,文档是这样使用的

clipboard.png

但如果我把红框中的file 改成 随便改成一个 ,比如,fileUpload, 然后 fileUpload.name 就什么都获取不到,所以说这里的file是什么意思,感觉不像是一个字符串,如果还是继续使用file.name,file由原来的白色,变成了深蓝色(可能跟主题有关),反正指向不一样了,什么时候表示类型,什么时候表示字符串,也希望有大佬能顺便解答一下

回答:

可以拿上传图片的base64

const reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = () => {
    const _base64 = reader.result
    console.log(_base64)
}

预览:https://jsfiddle.net/cLre0vfd/

回答:

传给后端用坐标方式裁剪

回答:

上传的方式不一样,常用的以FormData对象文件流的方式 或 先上传文件到服务器(或者为资源存储临时开辟的空间),
服务端返回上传后文件的地址。

iView是先上传图片到服务器,
服务端把上传后的地址通过文件上传钩子函数(如:on-success)返回,然后进行文件操作

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注