微信小程序如何动态调整图片尺寸大小？

本文共计753个文字，预计阅读时间需要4分钟。

我们知道微信小程序中的组件image用于展示图片，具有以下属性：

1.src：图片资源地址

2.mode：图片裁剪、缩放的模式

3.binderror：错误发生时触发的事件，事件名为AppService的事件名

我们都知道微信小程序的组件image是用来显示图片的，它有一下几个属性：

1、src 图片资源地址

2、mode 图片裁剪、缩放的模式

3、binderror 当错误发生时，发布到 AppService 的事件名，事件对象event.detail = {errMsg: ‘something wrong'}

4、bindload 当图片载入完毕时，发布到 AppService 的事件名，事件对象event.detail = {height:'图片高度px', width:'图片宽度px'}

但是image有默认的固定的宽度和高度，这样我们在做图片自适应的时候，就不好做了，特别是我们在做一些商品详情页的时候，需要image自适应屏幕,按原图比例显示。那么如何让image自适应比例显示呢？可以有两种方法：

一、使用mode：widthFix

widthFix：宽度不变，高度自动变化，保持原图宽高比不变。

首先我们先设置image的mode为widthFix，然后给图片加一个固定rpx的宽度，比如：730rpx。

这样图片也可以自适应了。。