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

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>
    
    点赞 打赏 评论
  • 鸟临窗语报天晴 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;
    }
    
    点赞 打赏 评论

相关推荐 更多相似问题