uniapp image标签base64不显示图片的问题

发表于 | 分类于

问题描述

如题，在uniapp中使用image标签，imgUrl是后端返回的一段base64格式的图片：

1
<image :src='imgUrl'>

这样可能会出现图片无法显示的问题，但是标签的src里是有值的，打开调试看到图片的透明度变成了0：

1
2
3
4
5
6
7
uni-image>img {
display: block;
position: absolute; 
top: 0;
left: 0;
opacity: 0; 
}

产生原因

这是因为base64字符串太长，在传输过程中加入回车导致

解决方法

把base64中的换行符替换掉就好了：

1
<image :src='imgUrl.replace(/[\r\n]/g, ")'>