vue项目中,因为详情页面内容是通过富文本编辑器过来的,所以在前端项目中就用到了v-html去渲染传过来的内容,但图片存在不能控制大小的问题,本文就解决如何修改微信小程序中图片大小的问题。
方式一:
将收到的数据经过处理再拿去渲染(本方法相对好用):
this.productInfo.content = this.productInfo.content.replace(/<img/g,"<img style='max-width:100%;height:auto;'");
方式二:
通过css样式去控制调整(不大好使):
::v-deep img{
width:100%;
}
总结:感觉还是方式一的正则好用,你若有更好的方式方法,欢迎交流。