baozhengrui

导航

图片连接转 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>

posted on 2024-07-02 08:42  芮艺  阅读(18)  评论(0编辑  收藏  举报