图片连接转 base64 并在页面中如何显示
图片链接改base64
// result.content图片链接
fetch("/navy" + result.content)
.then(response => response.blob())
.then(blob => {
// 将Blob对象转换为Base64字符串
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onloadend = () => {
const base64data = reader.result;
this.getDetail(base64data) // 此函数为将图片64传入次函数进行使用上传
};
})
.catch(error => console.error('获取图片失败:', error));
如果是连接则
<el-image
v-else-if="item.type==='image'"
:src="'/navy'+item.content"
fit="fill"></el-image>
如果是base64
<el-image
v-else-if="item.type==='image'"
:src= "data:image/png;base64," + res.data.imageBase64;
fit="fill"></el-image>