水越帆
2019-07-09 16:11
采纳率: 60%
浏览 8.8k
已采纳

vue+element-ui怎么将base64字符串显示成图片啊

百度上都是讲怎么转成base64,但是我现在是接收到了一个base64的字符串，
我该怎么将base64字符串显示成图片呢，表单的列字段如下

《el-table-column prop="img" label="头像" >《/el-table-column>

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • 水越帆 2019-07-15 15:50
    已采纳 
              <el-table-column prop="headimg"  label="头像" :show-overflow-tooltip="true">
            <template slot-scope="scope">
              <img :src="scope.row.headimg" style="width: 100%;border-radius: 50%;"/>
            </template>
          </el-table-column>
    已采纳该答案
    评论
    解决 无用 3
    打赏 举报
  • 鸟临窗语报天晴 2019-07-09 16:42

    <img src="data:image/png;base64=XXXXXX">

    如果是其他类型的图片，修改下data:后面的MIME类型就好了。

    其中XXXXXX是你的图片Base64编码后的结果。

    所有的MIME类型请戳-》MIME参考手册--来自W3SCHOOL-CN

    评论
    解决 无用
    打赏 举报
  • qq_33323642 2019-07-09 17:10

    //将base64转换为文件 data ---base64字符串 filename---生成文件的名字 ---- 传入的bsae64 去掉data:image/png;截取这个后面的
    function dataURLtoFile(data, filename) { 

        var bstr = atob(data), n = bstr.length, u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], {type: "jpg/png"});
    // return u8arr;
}
    评论
    解决 无用
    打赏 举报

报告相同问题？

提交

相关推荐 更多相似问题