小程序rich-text富文本
<rich-text nodes="{{product_content}}" class="richtext"></rich-text>
坑1:不能给richtext设置css,比如给richtext设置padding-bottom:100rpx
坑2:图片并不能很好的展示宽度
解决办法:替换img,增加样式:
product_content = product_content.replace('<img', '<img style="max-width:100%;height:auto" ')
可是replace方法只替换一个,使用正则替换全部:
data.content.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')
this.setData({product_content })
坑3:有时候富文本已经给了style="align:left",就把坑2的解决版本覆盖了。
可以用如下方法:
product_content = product_content.replace(/\<img/gi, '<img class="rich_img" ')
.rich_img{
max-width:100%;
height: auto;
}