一、微信小程序实现富文本图片宽度自适应的方法
- demo.wxml
<view>
<rich-text nodes='{{content}}'></rich-text>
</view>
- demo.js
var utils=require('../../utils/util')
data={
news:null
content:''
}
onLoad: function(){
this.content = utils.formatRichText(this.news.content);
或者
this.setData({
news_content:utils.formatRichText(res.data.news_content)
})
}
- util.js
function formatRichText(html){
let newContent= html.replace(/<img[^>]*>/gi,function(match,capture){
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
return match;
});
newContent = newContent.replace(/style="[^"]+"/gi,function(match,capture){
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
return match;
});
newContent = newContent.replace(/<br[^>]*\/>/gi, '');
newContent = newContent.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"');
return newContent;
}
module.exports = {
formatRichText
}
二、微信小程序-调用工具js文件/utils文件中的函数/变量
- utils中被调用的js
var URl='http://123.23.169';
var getImageurl=function(imageurl){
return URl+imageurl;
}
module.exports={
URl:URl,
getImageurl:getImageurl
}
- 要调用的js文件
var utils=require('../../utils/app.js')
console.log(utils) 可查看获得的函数
console.log(utils.getImageurl('iamgeaaddress.png'))