<rich-text>
图片样式和文字缩进问题
<rich-text nodes="{{content}}"></rich-text>
//content内容
'<p> 我是段落1</p>
<p> 我是段落2</p>
<p><img src="https://img.qiyuandi.com/images/5/wxxcx3ghyuzm3cfu.jpg" width="1440" height="1080" /></p>
<p> 我是段落3</p>
<p><img src="https://img.qiyuandi.com/images/5/wxxcxef5fasbzgj2.jpg" width="1440" height="1080" /></p>
<p><img src="https://img.qiyuandi.com/images/5/wxxcxhcnk3gr3dnz.jpg" width="1015" height="571" /></p>'
但是小程序 
并不生效,没有缩进效果。
content.replace(/ /g,"\xa0")
即可解决问题
最终代码为:
//重置img样式 、缩进p标签
resetCss: function (content) {
let reg = /(style|class)="[^"]+"/gi;
let img = /<img[^>]+>/gi;
let res;
// 去掉img原始样式
if (img.test(content)) {
res = content.match(img);
for (let i = 0; i < res.length; i++) {
content = content.replace(res[i], res[i].replace(reg, ""));
}
}
// 设置img样式、设置缩进
return content
.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block"')
.replace(/ /g,"\xa0")
},
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用?
- 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了?
- 找不到素材资源介绍文章里的示例图片?
- 模板不会安装或需要功能定制以及二次开发?
发表评论
还没有评论,快来抢沙发吧!