小程序
小游戏
企业微信
微信支付
扫描小程序码分享
<img style="max-width: 100px;max-height: 100px;" src="xxx.jpg">
web页面上的这种图片自适应方式怎么在小程序上实现
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
image 组件 mode 属性是否能满足需求?
https://mp.weixin.qq.com/debug/wxadoc/dev/component/image.html
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
<image class='image' lazy-load="true" mode="aspectFit" src="{{item.src}}" bindload='loadImg' style="{{item.style}}"></image>
loadImg(e) { let { width, height } = e.detail this.setData({ ['item.style']: "width:" + width + "px;" + "height:" + height + 'px;' }) },
图片加载完了,有个回调,会给出来宽高,再设置到style上面去。
不行,
就aspectFit能自适应最大的宽高,不过会产生留白。
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
image 组件 mode 属性是否能满足需求?
https://mp.weixin.qq.com/debug/wxadoc/dev/component/image.html
<image class='image' lazy-load="true" mode="aspectFit" src="{{item.src}}" bindload='loadImg' style="{{item.style}}"></image>
loadImg(e) { let { width, height } = e.detail this.setData({ ['item.style']: "width:" + width + "px;" + "height:" + height + 'px;' }) },
图片加载完了,有个回调,会给出来宽高,再设置到style上面去。
不行,
就aspectFit能自适应最大的宽高,不过会产生留白。