项目中遇到一个问题，使用 Vue 的 v-html 加载数据后，内容里边的后台传回图片太大，显示不全。
可以有以下解决方案
<style scoped>
.content >>> .img {
max-width: 100%;
height: auto;
}
</style>
但是在项目中，我并没有用 scoped 这个属性，加上后，会导致页面错乱严重，所以用了以下方法
res.content = res.content.replace(/<img/g,"<img style='max-width:100%;height:auto;'");
但是发现不起作用，查看返回数据发现后台返回没有 style 标签，只返回了宽高，所以改用以下方法
replacrImg(detailText) {
detailText = detailText.replace(/<img[^>]*>/gi, function(match, capture) {
return match.replace(/(style="(.*?)")|(width="(.*?)")|(height="(.*?)")/ig,
'style="max-width:100%;height:auto;"') // 替换style
});
return detailText;
},
以上可以解决v-html加载图片问题
