在文章详情页面通过WxParse.wxParse格式化html文章后，小程序内图片总是显示靠左且超出边界，如下图 is="wxParse" data="{{{wxParseData:data.node
在文章详情页面通过WxParse.wxParse格式化html文章后，小程序内图片总是显示靠左且超出边界，如下图
<template is="wxParse" data="{{{wxParseData:data.nodes}}}" />
一开始想着自己定义图片大小 ，将图片通过正则表达式匹配出来后，计算合适尺寸应该就可以了
var article = res.data.data.content;
article = article.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match, capture) {
if(capture.substr(0,2)=="//") {
capture = "https:" + capture;
}
var res = swan.getSystemInfoSync();
var newStr = "<img src='" + capture + "' style='width:" + (res.windowWidth - res.windowWidth * (80 / 750)) + "px'/>";
return newStr;
});
console.log(article);
替换成功，后加载WxParse.wxParse('data', 'html', article, self);后问题依旧
然后重新找到wxParse.js内，找到wxAutoImageCal方法 将
if (originalWidth > windowWidth) {
//在图片width大于手机屏幕width时候
autoWidth = windowWidth; // console.log("autoWidth" + autoWidth);
autoHeight = autoWidth * originalHeight / originalWidth; // console.log("autoHeight" + autoHeight);
results.imageWidth = autoWidth;
results.imageheight = autoHeight;
} else {
//否则展示原来的数据
results.imageWidth = originalWidth;
results.imageheight = originalHeight;
}
if (originalWidth > windowWidth) {
//在图片width大于手机屏幕width时候
autoWidth = windowWidth; // console.log("autoWidth" + autoWidth);
autoWidth = windowWidth - windowWidth * (80 / 750)
autoHeight = autoWidth * originalHeight / originalWidth; // console.log("autoHeight" + autoHeight);
results.imageWidth = autoWidth;
results.imageheight = autoHeight;
} else {
//否则展示原来的数据
results.imageWidth = originalWidth;
results.imageheight = originalHeight;
}
版权：【注明为本站原创的文章，转载请注明出处与原文地址！
本站部分转载文章能找到原作者的我们都会注明，若文章涉及版权,有侵犯到您的权利，请及时联系我们删除。请发至邮箱：253849310@qq.com 。
标题：小程序文章内容页面图片WxParse.wxParse大小不适合调整方案
本文链接：http://www.aiws.cc/kaifa/c393.html
描述：在文章详情页面通过WxParse.wxParse格式化html文章后，小程序内图片总是显示靠左且超出边界，如下图 is="wxParse" data="{{{wxParseData:data.node
更多信息请关注微信：13534259410
